stop div from inheriting parents width

[buggyboy]

If i have a menu using an unordered list how do i make the menu div expand to the width of how ever long the menu items extend.

<div id="menu">
<ul>
<li><a href="#">test 1</a>
<li><a href="#">test 2</a>
<li><a href="#">test 3</a>
</ul>
</div>

So #menu should change in width depending on how many menu items there are and not the width of the parent (body).

Floating #menu works, but how do i get that div in the middle without needing another div?

Typed on iPhone, so hope it made sense.

Thx

[casey]

You can try to use change the div that wraps the menu into an inline-block, which should make it match the size. and then you should be able to use margins and text-align to center it.

so you would add this to the menu container:

display:inline-block;
margin:0px auto;

and add this to the parent div:

text-align:center;

you might have to play around with it a bit, I did not test anything.

[buggyboy]

You can try to use change the div that wraps the menu into an inline-block, which should make it match the size. and then you should be able to use margins and text-align to center it.

so you would add this to the menu container:

display:inline-block;
margin:0px auto;

and add this to the parent div:

text-align:center;

you might have to play around with it a bit, I did not test anything.

Thankyou