Search code examples
csspositionmargin

Set position absolute and margin


I would like to set an element's position to absolute and have a margin-bottom, but it seems that the margin-bottom doesn't have an effect.

HTML:

<div id='container'></div>

CSS:

#container {
  border: 1px solid red;
  position: absolute; 
  top: 0px;
  right: 0px;
  width: 300px;
  margin-bottom: 50px; // this line isn't working
}

Solution

  • What are you expecting margin-bottom to do when your element is positioned by its top side?

    margin-bottom will only do anything to an absolutely-positioned element if the element has no top property.