SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict dreado's Avatar
    Join Date
    Jan 2005
    Location
    UK
    Posts
    221
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Float, List, Link IE problem

    Can anyone tell me why my floated links appear on separate lines in IE?

    HTML Code:
    <ul>
    <li><a href="#">link 1</a></li>
    <li><a href="#">link 2</a></li>
    <li><a href="#">link 3</a></li>
    <li><a href="#">link 4</a></li>
    </ul>
    Code:
    #navbot {
    	background-color: #185BA7;
    	background-image: url(navbot.gif);
    	height: 29px;
    }
    #navbot li {
    	list-style-type:none;
    
    }
    #navbot a {
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	font-size: 14px;
    	color: #FFFFFF;
    	font-weight: bold;
    	float:right;
    	display:block;
    	height: 29px;
    	padding-right: 3px;
    	padding-left: 4px;
    	margin-right: 2px;
    	margin-left: 2px;
    }
    #navbot a:link {
    	text-decoration: none;
    	font-weight: bold;
    	float:right;
    	display:block;
    	height: 29px;
    	padding-right: 3px;
    	padding-left: 4px;
    	margin-right: 2px;
    	margin-left: 2px;
    }
    #navbot a:visited {
    	text-decoration: none;
    	color: #FFFFFF;
    	font-weight: bold;
    	float:right;
    	display:block;
    	height: 29px;
    	padding-right: 3px;
    	padding-left: 4px;
    	margin-right: 2px;
    	margin-left: 2px;
    }
    #navbot a:hover {
    	text-decoration: none;
    	color: #134E8D;
    	font-weight: bold;
    	float:right;
    	display:block;
    	height: 29px;
    	padding-right: 3px;
    	padding-left: 4px;
    	margin-right: 2px;
    	margin-left: 2px;
    	background-color: #E4E6E7;
    }
    #navbot a:active {
    	text-decoration: none;
    	color: #134E8D;
    	font-weight: bold;
    	float:right;
    	display:block;
    	height: 29px;
    	padding-right: 3px;
    	padding-left: 4px;
    	margin-right: 2px;
    	margin-left: 2px;
    }
    Last edited by dreado; Feb 27, 2006 at 03:59.

  2. #2
    SitePoint Enthusiast
    Join Date
    Feb 2005
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    unless you are planning to have Those menus plus some Sub menus, IMO you dont have to bother to use <ul> and <li>. you can just span your links in some Class.
    Here is what i tried to change your html code like this but you have to define a class for the span:

    Code:
    <div><span><a  href="#">link 1</a> I <a href="#">link 2</a> 
          I <a href="#">link 3</a> I <a href="#">link 4</a></span> 
          
        </div>
    hope it helps

    Mickael

  3. #3
    SitePoint Addict dreado's Avatar
    Join Date
    Jan 2005
    Location
    UK
    Posts
    221
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The reason I used a list was just so the links were easily readable when viewed without the style sheet. I decided to get rid of it and put a dividing character in-between the links instead.


Bookmarks

Posting Permissions

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