Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3

Thread: UL text problem

  1. #1
    Regular Coder
    Join Date
    Jun 2007
    Posts
    805
    Thanks
    123
    Thanked 23 Times in 23 Posts

    UL text problem

    Hi!

    If you look at this page: http://www.behrentzs.com/Untitled-1.html in IE, all looks correct. However when you see it in FF, the menu text is totally messed up and goes right, instead of center as it should be.

    I've figured out that it's something with the <ul>, however I'm not totally sure. I can't seem to find the problem. Any clues?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">		
    body {				background-color:#000;
    				color:#000;
    				font-family:Verdana;							font-size:10px;
    				}
    
    * {				margin:0px;
    				}
    
    a.menulinks {			color:#fff;
    				font-size:12px;
    				font-weight:bold;
    				font-family:arial;
    				text-decoration:none;
    				}
    
    a:hover.menulinks {		color:#ff6600;
    				}
    
    ul#menulist {			list-style:none;
    				
    				}
    
    ul#menulist li {		margin-bottom:4px;
    				}
    			
    #container {			width:800px;
    				margin-right:auto;
    				margin-left:auto;
    				}
    		
    #header {			width:800px;
    				height:200px;
    				background-image:url(banner5.jpg);
    				background-repeat:no-repeat;
    				}
    				
    #menu {				width:99px;
    				padding-top:2px;
    				padding-bottom:2px;
    				float:left;
    				text-align:center;
    				background-color:#222;
    				border-left:1px solid #000;
    				border-top:1px solid #000;
    				}
    
    #menupic {			width:100px;
    				}
    		
    #main {				width:698px;
    				background-color:#333;
    				float:left;
    				border:1px solid #000;
    				}
    
    #footer {			width:800px;
    				height:19px;
    				float:left;
    				background-image:url(bg.png);
    				}
    </style>
    </head>
    
    <body>
    <div id="container">
    <div id="header">
    HEADER
    </div>
    <div id="menupic">
    <img src="menu.png" alt="" border="0"/>
    </div>
    <div id="menu">
    <ul id="menulist">
    <li><a class="menulinks" href="">Anmeldelser</a></li>
    <li><a class="menulinks" href="">Forum</a></li>
    <li><a class="menulinks" href="">Tutorials</a></li>
    <li><a class="menulinks" href="">Sports</a></li>
    <li><a class="menulinks" href="">Profile</a></li>
    <li><a class="menulinks" href="">Tagwall</a></li>
    </ul>
    </div>
    <div id="main">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean sollicitudin lacus sed orci. Suspendisse sagittis egestas sapien. Pellentesque habitant 
    
    morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean mauris nulla, ornare ac, luctus non, blandit quis, enim. Quisque sit amet 
    
    purus id sapien dapibus rhoncus. Suspendisse laoreet purus ut magna. Aenean id odio. Quisque sed ante. Aliquam sed tortor vel arcu accumsan molestie. Nulla 
    
    velit mauris, varius a, gravida eget, luctus sit amet, ipsum.<br/><br/>
    
    Fusce non felis. Sed vel dolor sit amet urna interdum interdum. Praesent pretium erat sed odio. Quisque eget leo. Donec eget purus. Aliquam congue tempus 
    
    tellus. Proin tellus. Donec vitae arcu. In mattis. Aliquam lobortis ipsum quis lectus. <br/><br/>
    
    Vestibulum pretium ultricies mauris. Duis ante nisl, facilisis at, venenatis sed, ultrices ac, eros. Nam nec dui. Class aptent taciti sociosqu ad litora 
    
    torquent per conubia nostra, per inceptos hymenaeos. Suspendisse posuere turpis ut felis. Donec sem. Nam urna magna, vestibulum sit amet, scelerisque ac, 
    
    cursus in, lectus. Cras consectetuer mi sed elit. Donec elementum malesuada ligula. Proin ac purus vel orci aliquet dictum. Morbi vitae dolor. Nunc magna. 
    
    Morbi nonummy lectus eu magna. Maecenas semper, risus vel pharetra egestas, magna arcu vestibulum tortor, non rhoncus mi felis non est. Proin massa. Nam 
    
    ullamcorper condimentum nunc. Duis laoreet tellus dapibus metus. Ut in dolor vel dolor facilisis aliquam. Vestibulum semper, nibh in scelerisque tempus, leo 
    
    purus euismod lectus, ac aliquam diam tortor in risus. <br/><br/>
    
    Praesent iaculis. Curabitur ut arcu. Nulla vulputate, augue id porta iaculis, est nulla cursus turpis, sit amet suscipit tellus nibh ac libero. Vestibulum 
    
    non metus. In ac nunc id lorem rhoncus sagittis. Etiam odio. Aliquam elementum scelerisque ipsum. Vivamus malesuada tortor eu arcu. Mauris ultrices neque eu 
    
    elit. Vivamus vel mauris. Proin vulputate dui a nisi. Quisque diam orci, feugiat facilisis, sodales nonummy, cursus eget, nisl. Praesent auctor nunc id 
    
    velit. Vivamus non dui. <br/><br/>
    
    In posuere ultricies leo. Nulla volutpat. Nulla bibendum. Aliquam metus. Ut vestibulum, quam sit amet condimentum posuere, leo pede lacinia enim, aliquet 
    
    aliquam velit ligula ut sapien. Maecenas nec nunc. In gravida molestie mi. Ut augue. Sed id ligula. Suspendisse ac pede. Quisque eget ligula. Nullam vehicula 
    
    est sit amet sapien. In auctor pede venenatis lorem. Etiam nec elit vitae leo convallis ultrices. Maecenas blandit posuere nunc. Nullam quis nunc. 
    
    </div>
    <div id="footer">
    </div>
    </div>
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    Sep 2007
    Location
    Raleigh, NC
    Posts
    273
    Thanks
    7
    Thanked 59 Times in 52 Posts
    Different browsers have different defaults for margins and paddings--FF is picking up padding on the UL. Just add padding: 0; to your ul#menulist and you should be golden.

    (in your resetting rule * {} you only zeroed out the margin, not the padding as well)

  • Users who have thanked vtjustinb for this post:

    CaptainB (10-24-2007)

  • #3
    Regular Coder
    Join Date
    Jun 2007
    Posts
    805
    Thanks
    123
    Thanked 23 Times in 23 Posts
    Ahh! Thanks dude, !


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •