Menu
I'm not sure if this is a bug in Google Chrome or if this is wanted, but it really annoys me: If I got something like
<body><div style="margin-bottom: 50px;">much content</div></body>
there is no margin shown by Chrome. The div just ends at the bottom browser edge. Literally, any other browser renders this correctly.
542
add a padding-bottom to the element containing your div, even if it's the body element. This works in all browsers, so you will have to remove the bottom margin from the div.
28
Wrap your whole site (or just the area that has the margin you want to capture) in a
<div style="overflow:auto;"></div>
If setting padding does not appeal to you, try the above. I didn't want to set padding, because a margin on the bottom of boxes is my standard way of making room for the next box when data is dynamic and I don't know whether there will be one.
Margins will not "bleed through" a box with overflow specified, so this fixes the problem in Chrome by allowing that last box to have margin inside the new overflow:auto div.
This change is inconsequential to the other browsers who were blocking that margin bleed anyway. I tested in IE 8 and up for regressions on that side and found none.
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
