Topic: Removing custom list-style-image from nested ul in print, MSIE

I've been running into an annoying CSS issue and was wondering if anyone else has seen this/knows a work around.

I have some ul's where the li's have a custom image.  In the screen style sheets I had to use background images, rather than list-style image, to get the required level of cross-browser fidelity.  However for print I had to switch back to list-style-images... (Now don't get me started on why MSIE seems to follow very different rules on what hacks work on print/screen style sheets....)

I finally got the required cross-browser fidelity for single level lists.  However, when moving on to the print stylings of nested lists, I'm running into a problem.  MSIE doesn't want to "give up" its custom list-style-image, no matter what I try....

For instance:

ul.special {
  list-style: inside url(some-image);
}

ul.special li {
  list-style: inside url(some-image);
  text-indent: -3ex;
  padding-left: 3ex;
}

ul.special li ul {
  list-style: outside disc;
}
ul.special li ul li{
  list-style: outside disc;
  text-indent: 0ex;
  padding-left: 0ex;

}


In FF, the print looks correct.  In MSIE, the nested list still uses the custom image.  Can anyone explain why? how to fix?

My RoR journey  -- thoughts on learning RoR and lessons learned in applying TDD and agile practices.

Re: Removing custom list-style-image from nested ul in print, MSIE

I would try reversing your code:

[code css]
ul.special li ul {
   list-style: disc outside;
}
[/code]

You can always hack the FF version with the:
[code css]
html>body ul.special li ul{
-- code here --
}
[/code]

if needed.

http://w3schools.com/css/pr_list-style.asp

matthewvb