CSS Gap between Container Border & Child Element
https://jsfiddle.net/3r5yw2st/1/
how do I get rid of that gap between the border and child
I've already removed the padding
what could cause this
Edit fiddle - JSFiddle - Code Playground
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
23 Replies
Looks like it has to do with how the viewport units are being rendered, use pixels, rem, or %
I would recommend not using viewport units like this, they are not some dynamic unit to use all over.
could you send me your version of the jsfiddle?
the gap is still there for me
I believe it has something to do with chrome browser versions
I'm using brave
I'm using Edge and don't see it
are you zoomed?
No but it disappears when I zoom out
I did have the gap with yours not mine though, also what I said still stand no matter. Don't use vmin like that
specially for border 😄
hm okay I'll try but is there any other way I could solve this?
If you are at any zoom level it can render different than it should just happens
ah okay
thanks anyway
FF shows my fiddle working fine too
yeah it might just be chrome then
could also be you are making body flex...
doesn't seem to change anything
could just be brave I just tested chrome too
I removed it
Edge is chrome
ah really
Yea I don't have brave to check but xD if all the rest don't do it then yea.. idk 😄
Also yea removing the flex on body fixes it too
This kinda stuff has to do with both how the units work and the child behavior.