开发者

CSS Negative margins for positioning

开发者 https://www.devze.com 2022-12-26 10:27 出处:网络
Is it ok to use negative margins for positioning? I 开发者_Go百科have a lot in my current site and feel like it\'s not such a stable way to position things. I usually suggest to use them too.

Is it ok to use negative margins for positioning? I 开发者_Go百科have a lot in my current site and feel like it's not such a stable way to position things. I usually suggest to use them too.

For example I have a checkout page with three divs on top of each other

<div class="A">
   header
</div>
<div class="B">
   content
</div>
<div class="C">
   footer
</div>

(A, B and C), which are meant to sit on top of each other, to appear attached. I did this using:

.B
{
    margin-top: -20px;
}

On div B, to meet the bottom of div A.

Is this good practice or shall I re-code using top and left?


If your divs have some margin between each other probably you didn't reset your margins and padding (see: http://meyerweb.com/eric/tools/css/reset/).

Generally speaking is not a bad thing to use negative margins, anyway if you are forced to set them almost everywhere probably you should refactor your css, because the result can be slightly different among the various browsers and this could lead to a big headache :) .


Negative margins have been known to cause problems in IE7 and below with content being cut off. And, as alias suggests, it could also indicate a problem with the rest of the design. But I think it is wrong to say that negative margins are 'bad development' in all cases. But as always, test test test.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号