“Oh no, baby, what is you doing?”
This breaks every image that’s in a grid in Safari by default. Definitely can’t be doing this. Please fix.
It happens when using the <figure> tag. Not sure if it happens when using a raw image.
20 Likes
Also please consider: When the user chooses to use the <figure> element or similar, Bricks should physically wrap the image with that element in the builder so that the <figure> is selectable independent of the image. Right now it’s quite confusing because Bricks settings panel affects the <figure> element and you can no longer style the image itself as it’s a nested element that’s not selectable.
11 Likes
Exactly! Thanks Kevin, as usual you hit the nail square on the head. Love ACSS and Frames and the way you ad value to Bricks and formerly Oxygen hahaha.
2 Likes
Hi Kevin,
Thanks so much for your report!
I was able to reproduce the issue and added it to our bug tracker. We’ll fix it as soon as possible.
In the meantime,
.brxe-image img {
height: unset;
}
should work.
Best regards,
timmse
3 Likes
Hi Kevin,
We’ve fixed this bug in Bricks 1.7 beta, now available as a manual download in your Bricks account: Account – Bricks
Please let us know if you are still experiencing issues.
Best regards,
timmse
2 Likes
Hi Timmse. Nearly all my height:100% images are still breaking.
I think that’s me though, using heights in Bricks rather than Bricks adding height:100%.
Not sure what I’m getting at there, that’s more of a ramble, sorry.
I’m not sure what you’re getting at either 
1 Like
Did you see my screenshot up there Tim? Looks like a img styled from Bricks CSS, but height still 100%?
I changed that to auto and it stopped the layout going crazy in Safari.
1 Like
Thanks @robp! Just got here looking for some help. I had a similar issue, my height was set to fit-content by default and all my images went all over the place. Setting it to auto seems to solve this for me 
1 Like
I’m not sure who is this “Tim” you’re talking to, but:
Yes, because it’s wrapped within a figure tag, isn’t it?
It’d be great if you would share a live link where I can see the issue in Safari 
Otherwise, I can only guess, and that won’t get us anywhere. Until then, have a great weekend!
Sorry, your username is off-putting so I often just default to Tim without thinking.
Looks like @mikdac has similar issues. No doubt its something with my code, but in Chrome etc. its all fine.
This would be an example Record breaking marketing campaigns for fostering in Devon. - White Space Advertising
I have been through much of it to change height to auto where possible already.
Where exactly? I don’t see any difference between Chrome and Safari 
It’s the larger image/blocky sections Stefan for me. In Chrome they all work and fit well, but on Safari they bleed out of containers, etc. I changed many of them to auto and hence why it’s looking better now.
I was just using absolutely positioned images height and width 100%, which was best practice on sites I found online, but Safari with the 100% seemed to break them all inside relative containers, which I understand is far better than background images, but perhaps I should just use the actual sized images if I can’t get it to work. It was all good on Chrome strangely.
Unfortunately, I still can’t see any difference. Which Safari version are you using and can you show me the differences in a screencast?