Float right and position absolute doesn't work together

css css-float position
trbaphong picture trbaphong · Jul 4, 2012 · Viewed 181.6k times · Source

I want a div to be always at the right of its parent div, so I use float:right. It works.

But I also want it to not affect other content when inserted, so I use position:absolute.

Now float:right doesn't work, my div is always at the left of its parent div. How can I move it to the right?

Answer

eivers88 picture eivers88 · Jul 4, 2012

Use

position:absolute; right: 0;

No need for float:right with absolute positioning

Also, make sure the parent element is set to position:relative;

Related questions

floating nav to the right with a fixed position?

My site navigation needs to be floated to the right side of the container, but be in a fixed position so that whenever the page scrolls, the navigation is still on the right 350px from the top. This worked until …

Read More
Mixing floating and fixed positioning

here is a standard use of float and fixed : <html> <head> <style type="text/css"> #bigDiv { background-color: red; height: 2000px; width: 100px; float: left; } #littleDiv { background-color: green; height: 400px; width: 200px; float: left; } #littleDivFixed { …

Read More
CSS: Placing divs left/center/right inside header

I've been trying to create a site with the following structure: But I can't seem to get the header correct (e1 left, e2 centered, e3 right). I want the three elements e1, e2 and e3 to be left, middle and …

Read More