CODEWITHSUNDEEP
csshtml
Jack
Jack

Reputation: 31

Stick div to the bottom of the page

I have div with position absolute and I want to put another div under.
The two divs have diffrent widths.
The div above is with position absolute and is centered. The div that should be at the bottom has 100% width.
How to make that?
Thanks!

Upvotes: 3

Views: 1007

Answers (5)

Mauro
Mauro

Reputation: 2070

Try this one, you can then move style to your css

<div style="width:500px; margin: auto; height:200px; background-color:black;">
</div>
<div style="width:100%; height:200px; background-color:green;">
</div>

Upvotes: 0

o0&#39;.
o0&#39;.

Reputation: 11863

  • make one div that contains both
  • use float:right

example:

div#p8015buttons {
    position:absolute;
    bottom:0.5em;
    right:0.5em;
    width:90px;
}
div.p8015 {
    float:right;
    margin:1px;
}

Upvotes: 2

user255631
user255631

Reputation: 345

Tested HTML MARKUP

<div class="wrapper">
<div class="left-ontent>
</div>
<div class="right-ontent>
</div>
</div>

CSS

.wrapper{width:980px;margin:0 auto;position:absolute;}
.left-content{float:left;width:630px;}
.right-content{float:right;width:320px;}

Upvotes: 0

Kyle
Kyle

Reputation: 67194

Not tested, but this should do it.

HTML:

<div class="wrapper">
      <div class="one">
         Content
      </div>
      <div class="two">
         More content
      </div>
    </div>

And the CSS:

    .wrapper
    {
      position:absolute;
      width: 500px; 
      height: 400px;/*whatever you want*/
      }

    .one,
    .two
    {
      position:relative; /*or static*/
    }

Hope it helps :)

Upvotes: 0

RoToRa
RoToRa

Reputation: 38390

Wrap both DIVs in a third one and position that one absolute instead of the original one.

Upvotes: 0

Related Questions