CODEWITHSUNDEEP
htmlcss
Alegro
Alegro

Reputation: 7956

Positioning elements regarding only the parent container?

My agony about element's positioning continues: 

<div id="container">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>

#div1 {
right:0; // what I want - it's right border should be 0px from the parent's right border, regardless of any other div inside.
}

#div2 {
bottom:0; // it's bottom border should be 0px from the parent's bottom border, regardless of any other div inside.
}

#div3 {
margin-left:auto;
margin-right:auto;
// should be on the parent's center, regardless...
}

So, I want the parent to be the reference, and not the neighbors.

Upvotes: 0

Views: 38

Answers (2)

ATOzTOA
ATOzTOA

Reputation: 35950

Just use CSS

position:relative;

Set this on div1, div2, div3.

Upvotes: 1

kamil-mrzyglod
kamil-mrzyglod

Reputation: 4998

Check this:

  #container {
  position: relative;
  }

  #div1 {
  position: absolute;
  right: 0px;
  }

  #div2 {
  position: absolute;
  bottom: 0px;
  }

  #div3 {
  margin: 0px auto;
  }

But this is solution you could find after 30 secs reading about div positioning...

Upvotes: 3

Related Questions