I have a div with margin-top:-200px
. I want the div to move up/behind the div above it.
Works great in all browsers except IE so far. margin-top:200px
works, so I know it's not a collapsing margin issue.
Is there a bug I am not aware of here?
It is possible to give margins a negative value. This allows you to draw the element closer to its top or left neighbour, or draw its right and bottom neighbour closer to it.
This issue is known as Margin Collapse and happens sometimes between top and bottom margins on block elements. That's why the margin doesn't work on the p tag. To make it work here an option is to use padding-top on the p tag. And on the a tag the margin doesn't work because it's an inline element.
Negative paddings are not allowed (and don't work) in css, only negative margins.
IE doesn't like negative margins and doesn't render them properly. Position your elements relatively or absolutely and use top: -200px
instead.
Note: positioning them may change the layout significantly and you may have to rework your styles.
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