Center floated element

[XaviJr]

It’s easier to explain with this example: http://jsfiddle.net/RW3BX/1/
The list can contain whatever text so it’s width is dynamic. .right have fixed width.

What I want is to center .right in the space that’s not occupied by the list.

I have this done with javascript but is it possible to do it with just css?

[wolfcry911]

It would be better to see what you’re actually trying to accomplish – its not a very good example. But, why float the container, or the ul? Zero the padding on the ul as well as the margin. set the container to text-align: center (not the .right div) and remove the .right float and set to display: inline-block;

[XaviJr]

@wolfcry911 I floated the container so it assumes the content size and the ul to have ul and .right side by side. What I’m trying to accomplish is to have a menu that can grow on the left and a search box that will be centered in the remaining space in .right.

@gcyrillus The problem with your solution is that .rigth has fixed width.

[waylaid]

If you don’t float .right at all its contents will be centered.

http://jsfiddle.net/waylaid/Z4wYb/

[XaviJr]

So simple.. Thank you!

[XaviJr]

You’re right. I misread your code. Thank you!

[Author]

Posts