Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

ul is floating to the right in firefox

ul floating

2:25 pm on Mar 17, 2009 (gmt 0)

New User

5+ Year Member

joined:Oct 23, 2008
posts: 16
votes: 0

I'm using an ul for this sites menu the ploblem is that in firfox the whole list seems to float frather right compared to where it is in ie. How do I correct this?

Here is the html

<div id="header">
<div class="top_menu">
<ul class="top_menu_list" style="position: relative; left: 3px; top: 135px; z-index: 3"><li class="top_menu_list_items">
<a href="index.php">Home</a></li><li class="top_menu_list_items">
<a href="mission.php">Mission</a></li><li class="top_menu_list_items">
<a href="Register.php">Register</a></li><li class="top_menu_list_items">
<a href="planner_login.php">Planner</a></li><li class="top_menu_list_items">
<a href="promote.php">Promote</a></li><li class="top_menu_list_items">
<a href="links.php">Links</a></li><li class="top_menu_list_items">
<a href="concert.php">Concert</a></li><li class="top_menu_list_items">
<a href="Pictures.php">Pictures</a></li></ul>

And here is the css

.top_menu_list {
margin: 0px;
list-style-type: none;
display: inline-block;
clear: both;
width: 900px;
height: 33px;
.top_menu_list_items {
padding: 0px 12px 0px 12px;
display: inline;
float: none;
position: relative;
right: auto;
left: auto;
margin-right: auto;
margin-left: auto;
.top_menu {
font-family: Arial, Helvetica, sans-serif;

Thanks,For the help.

[edited by: coopster at 5:01 pm (utc) on Mar. 17, 2009]
[edit reason] no personal urls please TOS [webmasterworld.com] [/edit]

5:17 pm on Mar 17, 2009 (gmt 0)

Senior Member

WebmasterWorld Senior Member swa66 is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Aug 7, 2003
votes: 0

As far as I remember, by default one uses padding on the <ul>, while the other uses margin on the <li>. In order to get rid of that unqual start, I usually do this:

* {
ul {
padding-left: 2em;

That way I know they'll have padding on the ul and no margin on the li, regardless of any built in browser default now or in the future.

5:59 pm on Mar 17, 2009 (gmt 0)

New User

5+ Year Member

joined:Oct 23, 2008
votes: 0

That works great!
I'll have to remeber to do it this way in the future.