Forum Moderators: not2easy

Message Too Old, No Replies

display list-item/block problem with mozilla

         

mikkomu

11:42 am on Oct 22, 2004 (gmt 0)

10+ Year Member



I'm trying to do vertical list menu with help of css. Now I have problem when I have list-style-image and when the display is set to be block or list-item mozilla makes an extra line with the list-item-image. So instead of nice list with image and text after it on each row I have only image one one row and image and text on the next one.
IE in this case works the right way.

Any ideas how to make the list right in both?

createErrorMsg

1:57 pm on Oct 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



when the display is set to be block or list-item

Exactly which element do you have set to display: list-item? Which element did you give the list-style-image to?

It sounds like the image is being applied to more than just the LIs. Can you post the html & css code for the menu for us to see?

mikkomu

8:52 am on Oct 25, 2004 (gmt 0)

10+ Year Member



HTML:

<div id="subnavcontainer">
<ul id="subnavlist">
<li id="active"><a href="index.php?option=content&amp;task=view&amp;id=3&amp;Itemid=28" class="images" >Welcome</a></li>
<li id="active"><a href="index.php?option=content&amp;task=view&amp;id=4&amp;Itemid=29" class="images" >Welcome again</a></li>
</ul>
</div>

and CSS:

#subnavcontainer 
{
width: 150px;
}

#subnavcontainer ul
{
font-size: 11px;
font-family: Tahoma, Arial, Helvetica, Geneva, Swiss, SunSans-Regular;
padding: 0px 0px;
margin: 0;
color: #FFFFFF;
font-weight: none;
text-decoration: none;
list-style-type: none;
list-style-image: url(../images/Blue_arrow.gif);
}

#subnavcontainer a
{
width: 150px;
display: list-item;
padding: 3px;
background: #CCD6E0 url(../images/Blue_Dot.gif) repeat-x bottom;
color: #039;
text-decoration: none;
}

#subnavcontainer a:hover
{
text-decoration: underline;
}

I noticed that I had list-style-type defined elsewhere in li also. When I took it off the image dissappeared allthough it is defined in #subnavcontainer ul..

mikkomu

7:29 am on Oct 27, 2004 (gmt 0)

10+ Year Member



Any ideas?

I still haven't got it working right with mozilla.

I tried


#subnavlist
{
list-style: url(../images/Blue_arrow.gif) inside;
}

and it still shows extra list-item-image in mozilla on every other line..
And nothing else works either what I've tried.