Ben Fenwick Ben Fenwick - 7 months ago 9
HTML Question

How can I get an absolute element to float right within its parent?

So, I'm trying to get a dropdown to work as part of a menu. I have a ul with a few li elements added on the left and then I want to have an li element float to the right. I was doing this using relative position before, but now I want it to be able to overflow and display over anything below it.

I found this question:
CSS: Overflow Auto and Z-index
and found out you have to use absolute position to get this sort of overflow to happen. So, how would I do this?

This is the basic code structure:

<ul>
<li id="right_item1"/> (relatively positioned)
...
<li id="absolute_position"/> (absolutely positioned, floating right)
</ul>

QoP QoP
Answer

This should work for you.

ul{
    position:relative; // You need this
}

#absolute_position{
   position:absolute;
   right:0;
   bottom:0; 

}
Comments