Boxes left images cutoff looks bad

[Audun MB+ 17]

Here:http://attac.no/global-ulikhet/

The images are forced into a boxed frame so that you can't see the whole picture. Doesn't look so good. Is this a bug? A feature? How can I fix it?

[Andrew 207]

The problem is due to the large header text causing the flexbox container to be wider than intended (when responsive)

My suggestion would be to add a media query to either tweak the layout or size of the text depending on your desired effect.

@media screen and (max-width: 760px) {
#page .boxes .pl-control-left .the-boxes-media {
  max-width: 50px;
}
}

[Audun MB+ 17]

That didn't work and a short title doesnt change anything:

The images is still cut off. 

[Audun MB+ 17]

On 30.1.2017 at 6:09 PM, Andrew said:

The problem is due to the large header text causing the flexbox container to be wider than intended (when responsive)

My suggestion would be to add a media query to either tweak the layout or size of the text depending on your desired effect.

@media screen and (max-width: 760px) {
#page .boxes .pl-control-left .the-boxes-media {
  max-width: 50px;
}
}

Nah. That's not it. This works:

.boxes .pl-control-left .the-boxes-media {
    max-width: 400px;
}

.boxes .pl-image {
    background-size: contain;
    background-repeat: no-repeat;
}

Any chance of fixing that in the next version of Boxes? Add a "Full image" in addition the Standard/Default or Rounded options?

Max-width should probably be the same as the value set for image width, but as 400 is the max there, it works.