My website is showing up differently on Safari vs Firefox. I would like to have the CSS make it look the same on Safari. I know that I could use two div boxes, one for the outline, one for the image, but I like how on Firefox I only need one and it curves the outline and the image. Is there anyway to have Safari curve the outline and the image?
<img src="asset.jpg" class="example">
background: rgba(0, 0, 0, .6);
This is a known bug in webkit browsers
See this example
So in short, yes, for now you have to wrap the image in a div. Sucks.
See these bug reports:
For now, wrap it in a div, as I have done here