Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do i properly position absolute divs within twitters bootstrap css framework

I can't seem to get a div to absolutely position within its parent using the twitter bootstrap framework. I have a series of rows that follow a scheme as follows

<div id='wrapper'>
<div class='row-fluid'>
    <div class='span2'>some content here</div>
    <div class='span9'>other content to the side of the first div</div>
    <div class='timestamp'>123456 this should align to the bottom right of wrapper</div>
</div>
</div>

css

.timestamp{
   position:absolute;
   bottom:0px;
   right:0px;
}

But the timestamp div always positions itself to the absolute of the body of the whole dom document ignoring any intermediate divs. Any ideas what is causing this?

like image 676
Brian Avatar asked Mar 27 '12 22:03

Brian


People also ask

What is the best way to position elements in CSS?

The absolute positioning is best if you need something the be placed at an exact coordinate. The relative positioning will take where the element already is, and add the coordinates to it.

What does position absolute do in CSS?

Position absolute takes the document out of the document flow. This means that it no longer takes up any space like what static and relative does. When position absolute is used on an element, it is positioned absolutely with reference to the closest parent that has a position relative value.

How would you absolutely positioned element?

An absolutely positioned element is an element whose computed position value is absolute or fixed . The top , right , bottom , and left properties specify offsets from the edges of the element's containing block. (The containing block is the ancestor relative to which the element is positioned.)


1 Answers

Your css should include

 #wrapper {
    position: relative;
}

The default positioning is static.

check out this article: http://css-tricks.com/absolute-positioning-inside-relative-positioning/

like image 166
Nic Meiring Avatar answered Nov 01 '22 13:11

Nic Meiring