Hi, everyone.

I’ve got a positioning issue in Safari. Chrome is working as expected.

I’ve attached screenshots of what it looks like in Chrome (how I need it to be) and how it is in Safari. Plus, the code.

I’ve changed some stuff in the Safari Web Inspector and can’t seem to fix it. I think it’s the padding in the second element, but not entirely sure.

Any help is appreciated.

Thank you,

Ste.

<div style="position: relative; display: inline-block; width: 345px; float: left; margin-right: 15px; background-color: rgb(255, 255, 255);">

<div style="padding-top: 56.25%; position: relative; background-color: rgb(255, 255, 255); margin-right: 10px;"><iframe src="edited out" allow="encrypted-media" style="position: absolute; inset: 0px; width: 345px; height: 195px; background-color: rgb(255, 255, 255);"></iframe></div>

</div>

r/webdev - Safari positioning issue - please help!

Chrome

r/webdev - Safari positioning issue - please help!

Safari

r/webdev - Safari positioning issue - please help!

Code

r/webdev - Safari positioning issue - please help!

Padding, highlighted green



Source link

Write A Comment