www.webdeveloper.com
Results 1 to 7 of 7

Thread: CSS menu not displaying properly in IE

Hybrid View

  1. #1
    Join Date
    Mar 2006
    Location
    Nairobi
    Posts
    7

    CSS menu not displaying properly in IE

    This menu diplays ok in FF & Opera but is screwed up in IE .

    The CSS:
    Code:
    #tabs1 {
          float:left;
          width:100%;
    	   font-size:93%;
          line-height:normal;
    	  border-bottom:1px solid #BCD2E6;
    	  font: bold 11px/1.5em Tahoma;
    	background-color: transparent;
          }
        #tabs1 ul {
    	  margin:0;
    	  padding:10px 10px 0 50px;
    	  list-style:none;
          }
        #tabs1 li {
          display:inline;
          margin:0;
          padding:0;
          }
        #tabs1 a {
          float:left;
          background:url("../images/tableft1.gif") no-repeat left top;
          margin:0;
          padding:0 0 0 4px;
          text-decoration:none;
          }
        #tabs1 a span {
          float:left;
          display:block;
          background:url("../images/tabright1.gif") no-repeat right top;
          padding:5px 15px 4px 6px;
          color:#627EB7;
          }
        /* Commented Backslash Hack hides rule from IE5-Mac \*/
        #tabs1 a span {float:none;}
        /* End IE5-Mac hack */
        #tabs a:hover span {
          color:#627EB7;
          }
        #tabs1 a:hover {
          background-position:0% -42px;
          }
        #tabs1 a:hover span {
          background-position:100% -42px;
          }
    
          #tabs1 #current a {
          	background-position:0% -42px;
          }
          #tabs1 #current a span {
          	background-position:100% -42px;
          }
    The page

    DOes anyone know how to make IE display the menu correctly?

    Thanks for the help

    Kwezi
    Whatever the mind of man can concieve and believe, it can achieve!
    Affordable WebHosting

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Your link is not correct
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Mar 2006
    Location
    Nairobi
    Posts
    7

    CSS menu

    Sorry about that here it is
    The page



    Kwezi
    Whatever the mind of man can concieve and believe, it can achieve!
    Affordable WebHosting

  4. #4
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    #tabs1 {
    float:left;
    width:100%;
    font-size:93%;
    line-height:normal;
    border-bottom:1px solid #BCD2E6;
    font: bold 11px/1.5em Tahoma;
    background-color: transparent;
    }
    Define a width that accomodates the accumulated width of the tabs, and a height, and you will probably have to 'position:relative; ' this, or center it. However it looks best.
    This should force the tabs to remain horizontal (even though the "display:inline;" for the <li> should take care of that..).

    I might suggest, from a SEO stance, that the <title></title> be changed from:

    <title>== Welcome to Continental Products - Industrial and Construction Adhesives ==</title>

    to:

    <title>Continental Products - Industrial and Construction Adhesives ==</title>

    so that the page is indexed properly by the first-letter of the corporation name. Otherwise, the site gets indexed by either "==" or "Welcome~". Never start a <title></title> with "The~" or "Welcome~" or "My" (unless the page-name actually includes the word "My" like "MyWebPages" in meaningful common-language use).
    Page-ranks are partially dependant upon reliable, indexable terms and words like "the" and "welcome" are closer to dismissable.

    I'd even opt for:

    <title>Continental Products - Industrial and Construction Adhesives == == Welcome!</title>

    As it puts the 'company name' FIRST, and thus, would be indexed better.
    Last edited by WebJoel; 05-14-2007 at 07:29 AM.
    I build for: Firefox and tweak for IE

  5. #5
    Join Date
    Mar 2006
    Location
    Nairobi
    Posts
    7

    Works :)

    Quote Originally Posted by WebJoel
    Define a width that accomodates the accumulated width of the tabs, and a height, and you will probably have to 'position:relative; ' this, or center it. However it looks best.
    This should force the tabs to remain horizontal (even though the "display:inline;" for the <li> should take care of that..).
    Thanks WebJoel,

    I simply defined a width in px and voila!

    Thanks again

    Kwezi
    Whatever the mind of man can concieve and believe, it can achieve!
    Affordable WebHosting

  6. #6
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    Nice.
    I build for: Firefox and tweak for IE

  7. #7
    Join Date
    Mar 2006
    Location
    Nairobi
    Posts
    7

    Seo

    Quote Originally Posted by WebJoel
    I might suggest, from a SEO stance, that the <title></title> be changed from:

    <title>== Welcome to Continental Products - Industrial and Construction Adhesives ==</title>

    to:

    <title>Continental Products - Industrial and Construction Adhesives ==</title>

    so that the page is indexed properly by the first-letter of the corporation name. Otherwise, the site gets indexed by either "==" or "Welcome~". Never start a <title></title> with "The~" or "Welcome~" or "My" (unless the page-name actually includes the word "My" like "MyWebPages" in meaningful common-language use).
    Page-ranks are partially dependant upon reliable, indexable terms and words like "the" and "welcome" are closer to dismissable.

    I'd even opt for:

    <title>Continental Products - Industrial and Construction Adhesives == == Welcome!</title>

    As it puts the 'company name' FIRST, and thus, would be indexed better.
    thanks for the tip, am still learning SEO techniques and i appreciate the help.
    will be applying the suggestions pronto,

    Kwezi
    Whatever the mind of man can concieve and believe, it can achieve!
    Affordable WebHosting

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles