The following page <!-- m --><a class="postlink" href="http://wsdev.colostate.edu/cwis116/admmock/dsp_trn.cfm">http://wsdev.colostate.edu/cwis116/admmock/dsp_trn.cfm</a><!-- m -->
renders the left navigation properly in mozilla and opera. There is extra space between list items in IE 6.0.
I looked in the forum, and saw the solution discussed as "holly hack" and tried with "height:1%" added to #leftnav li {} and #leftnav a {}. It did not work for me. How do you I fix this?
Thanks.
CSS:
#leftnav ul
{
margin: 0;
padding: 0;
list-style-type: none;
}
#leftnav a
{
display: block;
color: #FFF;
background-color: #030;
padding: 3px 12px 3px 8px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: bold;
}
#leftnav a:hover
{
background-color: #ddc642;
color: #FFF;
}
#leftnav li li a
{
display: block;
color: #FFF;
background-color: #050;
margin:0;
padding: 3px 3px 3px 17px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: normal;
height:1%;
}Add width:100%; to #leftnav aIf that doesn't work, you're running into an IE-Win bug that renders the source-code line breaks on screen after your </li> tags. This only occurs when you have a block display <a> tag inside a list item tag. I've always solved it by floating the LI tags for IE-Win:
/* Hide from IE5-Mac \*/
* html #leftnav a {
float: left;
width: XXXpx;
}
renders the left navigation properly in mozilla and opera. There is extra space between list items in IE 6.0.
I looked in the forum, and saw the solution discussed as "holly hack" and tried with "height:1%" added to #leftnav li {} and #leftnav a {}. It did not work for me. How do you I fix this?
Thanks.
CSS:
#leftnav ul
{
margin: 0;
padding: 0;
list-style-type: none;
}
#leftnav a
{
display: block;
color: #FFF;
background-color: #030;
padding: 3px 12px 3px 8px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: bold;
}
#leftnav a:hover
{
background-color: #ddc642;
color: #FFF;
}
#leftnav li li a
{
display: block;
color: #FFF;
background-color: #050;
margin:0;
padding: 3px 3px 3px 17px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: normal;
height:1%;
}Add width:100%; to #leftnav aIf that doesn't work, you're running into an IE-Win bug that renders the source-code line breaks on screen after your </li> tags. This only occurs when you have a block display <a> tag inside a list item tag. I've always solved it by floating the LI tags for IE-Win:
/* Hide from IE5-Mac \*/
* html #leftnav a {
float: left;
width: XXXpx;
}