Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › [Solved] UL inside an UL IE problem

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)

CSS used:

Code:
#content-side ul.list, #content-side ul.link-list-vertical {
margin:0px 0px 15px 0px;
padding:0px;
}

#content-side ul.list li {
list-style:none;
padding:2px 0px 2px 12px;
margin:0px;
background: url(bullet-right.gif) no-repeat;
background-position:0 .6em;
}

#content-side ul.link-list-vertical li {
list-style:none;
margin:0px;
padding:3px 0px 4px 0px;
border-bottom:1px solid #C1C1C1;
background:url(link-list-vertical_background.gif) top right repeat-y;
}

#content-side ul.link-list-vertical li a:link, #content-side ul.link-list-vertical li a:visited, #content-side ul.link-list-vertical li a:active {
padding:2px 0px 2px 12px;
background: url(red_arrow.gif) no-repeat;
background-position:0 6px;
color:#666366;
font-size:10px;
font-weight:bold;
text-decoration:none;
}

#content-side ul.link-list-vertical li a:hover {
color:#ED171F;
}

#content-side ul.link-list-vertical ul {
margin:0px;
padding:0px;
}

#content-side ul.link-list-vertical ul li {
list-style:none;
margin:0px;
padding:3px 0px 4px 26px;
border-bottom:1px solid #C1C1C1;
background-color:#FFF;
background-image:none;
}

#content-side ul.link-list-vertical ul li a:link, #content-side ul.link-list-vertical ul li a:visited, #content-side ul.link-list-vertical ul li a:active {
padding:2px 0px 2px 12px;
background: url(dash.gif) no-repeat;
background-position:0 6px;
color:#666366;
font-size:10px;
font-weight:bold;
text-decoration:none;
}

#content-side ul.link-list-vertical ul li a:hover {
color:#ED171F;
}

Thanking you in advance,
Natsnav

July 5, 2010 at 11:44 am #79290
TheDoc
Member

Technically, that isn’t coded correctly, and is probably throwing a validation error. While this fix might not help with your problem in IE, you should always follow this pattern:

Code:
  • List Item
  • List Item
    • Nested List Item
  • List Item

See how on the second list item, it’s closed after the nested list? Give that a shot.

July 5, 2010 at 1:47 pm #79297
supperman
Participant

What im seeing is:

-Flash Report
-Monthly
-YTD
…

In both FF and IE6.

July 5, 2010 at 7:29 pm #79304
natsnav
Member

While I’m aware this isn’t technically correct markup, I’m hoping to find a way of replicating the result displayed in Firefox in IE.
Whether that means placing the nested UL into the LI of the parent UL or not.

July 5, 2010 at 7:53 pm #79307
virtual
Participant

You are putting IE in quirks mode because of this

Quote:
<!Finance html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

on the first line of your source code and there are also 25 validation errors.

Do what TheDoc said nest your ul li tags correctly and clean up your coding errors, then IE might be nice to you…. ;)

July 5, 2010 at 8:27 pm #79308
natsnav
Member

Done and Done. I’m working over the top of someones existing HTML, I’ve changed the HTML mark up and fixed the CSS.
It’s now perfect. Thanks for the help guys.

As soon as I saw the HTML marked up incorrectly I should have just fixed it. As I’ve never encountered a UL marked up in a UL like that.

Cheers!

  • Author
    Posts
    • Viewing 6 posts - 1 through 6 (of 6 total)