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 5 of 5
  1. #1
    Senior Coder NancyJ's Avatar
    Join Date
    Feb 2005
    Location
    Bradford, UK
    Posts
    3,169
    Thanks
    19
    Thanked 65 Times in 64 Posts

    bulleted lists in IE

    I'm having a problem in IE when the content of a list item wraps onto a second line the bullet appears against the bottom line of the list item, in firefox and opera it appears at the top where it belongs

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,253
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Eh?

    Not on a standard unordered list it doesn't! Have you done anything with custom bullets, alignment, styles etc? At any rate: can you supply markup/styles or a link to the page in question?
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #3
    Senior Coder NancyJ's Avatar
    Join Date
    Feb 2005
    Location
    Bradford, UK
    Posts
    3,169
    Thanks
    19
    Thanked 65 Times in 64 Posts
    Code:
    ul.mainnav{
    margin-top:40px;
    font-size:9pt;
    list-style-type:none;
    }
    ul.subnav {
    list-style: none;
    width: 110px; /* Width of Menu Items */
    position:absolute;
    top:208px;
    font-size: 9pt;
    font-weight:bold;
    
    }
    
    ul.subnav li, ul.mainnav li {
    position: relative;
    
    }
    
    ul.subnav {
    position: absolute;
    left: 70px; /* Set 1px less than menu width */
    top: 0;
    display: none;
    
    }
    
    ul.subnav li{
    position:relative;
    z-index: 99;
    background-image: none;
    background-color:#6FB9E6;
    color:#FFF;
    width:150px;
    height:23px;
    font-family:arial, verdana, helvetica, sans-serif;
    border-style:solid;
    border-width:0px; 
    
    border-bottom-width:1px;
    border-color: #FFF;
    
    
    }
    
    /* Styles for Menu Items */
    ul.mainnav li a {
    background-image: url(../images/navbg_up.gif);
    width:110px;
    height:23px;
    display:block;
    text-decoration:none;
    color:#FFF;
    font-family:arial, verdana, helvetica, sans-serif;
    font-weight:bold;
    text-align:left;
    vertical-align:middle;
    line-height:23px;
    border-style:solid;
    border-width:0px;
    border-bottom-width:1px;
    border-color:#DEF1F9;
    padding:0px;
    padding-left:8px;
    
    }
    
    ul.subnav li a {
    border:0px;
    background-image: none;
    background-color: #E3F1FA;
    width:150px;
    height:23px;
    display:block;
    text-decoration:none;
    color:#6ABDE7;
    font-family:arial, verdana, helvetica, sans-serif;
    font-weight:bold;
    text-align:left;
    vertical-align:middle;
    line-height:23px;
    
    
    
    }
    .nolink {
    z-index: 10;
    height:23px;
    border-style:solid;
    border-width:0px;
    border-bottom-width:1px;
    border-color:#FFF;
    padding: 2px;
    padding-left:8px;
    }
    
    /* Fix IE. Hide from IE Mac \*/
    * html ul li { float: left; height: 1%; }
    * html ul li a { height: 1%; }
    /* End */
    
    ul.subnav li a:hover, ul.mainnav li a:hover { 
    background-image: url(../images/navbg_over.gif);
    color:#40A4CE; } /* Hover Styles */
    
    ul.subnav li a:hover {
    background-image: none;
    background-color:#6EB9E5;
    color:#FFF;
    }
    
    li:hover ul.subnav, li.over ul.subnav { display: block;
    
    padding-bottom:0px;
     } 
    ul li {float:none;}
    This is my style sheet, I'm using a list nav but I have to add float:none on each li tag to get the bullets to show at all in ie

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,253
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Confusing

    Your style rules are a bit confusing; try to reduce the number of rules a bit: I saw several rules which declare properties that could be combined, and some properties are declared more then once, which makes it somewhat harder to figure out what's going on.

    Anyway: you omitted the markup; based on the class names, I can make a calculated guess what's the plan, but please include the relevant markup as well so nothing gets missed.

    Once you supplied the markup I can try it out for myself; the backround image used doesn't seem to play a major role, so I can make do without that one.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #5
    Senior Coder NancyJ's Avatar
    Join Date
    Feb 2005
    Location
    Bradford, UK
    Posts
    3,169
    Thanks
    19
    Thanked 65 Times in 64 Posts
    the .subnav and .mainnav classes are the navigation list styles,
    the normal <li> declarations should have no style applied and in firefox and opera it renders without any style applied but in IE without the float:none it applies to float and list-style properties from the menu items


  •  

    Posting Permissions

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