...

View Full Version : bulleted lists in IE



NancyJ
03-16-2005, 05:17 PM
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

ronaldb66
03-17-2005, 09:19 AM
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?

NancyJ
03-17-2005, 10:15 AM
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

ronaldb66
03-17-2005, 01:23 PM
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.

NancyJ
03-17-2005, 01:36 PM
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



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum