List background-image not showing in IE6

  • michaelbenson
  • Born
  • Born
  • michaelbenson
  • Posts: 1

Post 3+ Months Ago

Hi guys, after checking out my website in different browsers through browsershots I noticed that it works perfectly in every website but, you guessed it, IE6 :mad: There appears to be some issues with displaying the background-image property for some list items - here is the CSS:

Code: [ Select ]
/* --- NAVIGATION INFORMATION --- */
ul.pagenav
{
  list-style:none;
  margin:0 !important;
  padding:0 !important;
}

.page_item a
{
  display:block;
  height: 97px !important;
  width: 300px !important;
  text-decoration:none;
  text-align:left;
  color:#93114a !important;
  margin:0 !important;
  padding:0 !important;
}

.page-item-home
{
  background:transparent url('images/benson/Go-Back-Home---Dim.jpg') no-repeat;
  margin:0 !important;
  padding:0 !important;
}

.page-item-home a:hover
{
  background:transparent url('images/benson/Go-Back-Home.jpg') no-repeat;
}

.page-item-9
{
  background:transparent url('images/benson/Get-Invovled---Dim.jpg') no-repeat;
  margin:0 !important;
  padding:0 !important;
}

.page-item-9 a:hover
{
  background:transparent url('images/benson/Get-Invovled.jpg') no-repeat;
}

.page-item-11
{
  background:transparent url('images/benson/Give-Me-60-Seconds---Dim.jpg') no-repeat;
  margin:0 !important;
  padding:0 !important;
}

.page-item-11 a:hover
{
  background:transparent url('images/benson/Give-Me-60-Seconds.jpg') no-repeat;
}

.page-item-2
{
  background:transparent url('images/benson/What-Do-You-Do---Dim.jpg') no-repeat;
  margin:0 !important;
  padding:0 !important;
}

.page-item-2 a:hover
{
  background:transparent url('images/benson/What-Do-You-Do.jpg') no-repeat;
}

.page-item-3
{
  background:transparent url('images/benson/Why-Bother---Dim.jpg') no-repeat;
  margin:0 !important;
  padding:0 !important;
}

.page-item-3 a:hover
{
  background:transparent url('images/benson/Why-Bother.jpg') no-repeat;
}

.current_page_item
{
  display:none;
}
  1. /* --- NAVIGATION INFORMATION --- */
  2. ul.pagenav
  3. {
  4.   list-style:none;
  5.   margin:0 !important;
  6.   padding:0 !important;
  7. }
  8. .page_item a
  9. {
  10.   display:block;
  11.   height: 97px !important;
  12.   width: 300px !important;
  13.   text-decoration:none;
  14.   text-align:left;
  15.   color:#93114a !important;
  16.   margin:0 !important;
  17.   padding:0 !important;
  18. }
  19. .page-item-home
  20. {
  21.   background:transparent url('images/benson/Go-Back-Home---Dim.jpg') no-repeat;
  22.   margin:0 !important;
  23.   padding:0 !important;
  24. }
  25. .page-item-home a:hover
  26. {
  27.   background:transparent url('images/benson/Go-Back-Home.jpg') no-repeat;
  28. }
  29. .page-item-9
  30. {
  31.   background:transparent url('images/benson/Get-Invovled---Dim.jpg') no-repeat;
  32.   margin:0 !important;
  33.   padding:0 !important;
  34. }
  35. .page-item-9 a:hover
  36. {
  37.   background:transparent url('images/benson/Get-Invovled.jpg') no-repeat;
  38. }
  39. .page-item-11
  40. {
  41.   background:transparent url('images/benson/Give-Me-60-Seconds---Dim.jpg') no-repeat;
  42.   margin:0 !important;
  43.   padding:0 !important;
  44. }
  45. .page-item-11 a:hover
  46. {
  47.   background:transparent url('images/benson/Give-Me-60-Seconds.jpg') no-repeat;
  48. }
  49. .page-item-2
  50. {
  51.   background:transparent url('images/benson/What-Do-You-Do---Dim.jpg') no-repeat;
  52.   margin:0 !important;
  53.   padding:0 !important;
  54. }
  55. .page-item-2 a:hover
  56. {
  57.   background:transparent url('images/benson/What-Do-You-Do.jpg') no-repeat;
  58. }
  59. .page-item-3
  60. {
  61.   background:transparent url('images/benson/Why-Bother---Dim.jpg') no-repeat;
  62.   margin:0 !important;
  63.   padding:0 !important;
  64. }
  65. .page-item-3 a:hover
  66. {
  67.   background:transparent url('images/benson/Why-Bother.jpg') no-repeat;
  68. }
  69. .current_page_item
  70. {
  71.   display:none;
  72. }


Code: [ Select ]
<ul class="pagenav">


<li class="page_item page-item-11"><a href="xxx/60-seconds/" title="60 Seconds …">60 Seconds …</a></li>
<li class="page_item page-item-9"><a href="xxx/get-involved/" title="Get Involved!">Get Involved!</a></li>
<li class="page_item page-item-2"><a href="xxx/what-do-you-do/" title="What Do You Do?">What Do You Do?</a></li>
<li class="page_item page-item-3"><a href="xxx/why-vote/" title="Why Bother Voting?">Why Bother Voting?</a></li>

</ul>
  1. <ul class="pagenav">
  2. <li class="page_item page-item-11"><a href="xxx/60-seconds/" title="60 Seconds …">60 Seconds …</a></li>
  3. <li class="page_item page-item-9"><a href="xxx/get-involved/" title="Get Involved!">Get Involved!</a></li>
  4. <li class="page_item page-item-2"><a href="xxx/what-do-you-do/" title="What Do You Do?">What Do You Do?</a></li>
  5. <li class="page_item page-item-3"><a href="xxx/why-vote/" title="Why Bother Voting?">Why Bother Voting?</a></li>
  6. </ul>


If anyone could help me out I would really appreciate this! It appears as though the last item in the list has its background image property displayed correctly, but the rest are not.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9089
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

Do you have a screenshot of the problem that you can attach to this post?
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

In addition to what Bigweb requested...

I don't understand why you're using the "transparent" directive in the LI's when the parent element, UL, doesn't have a background.

Have you tried it without that directive?
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

I played around with this for a while and couldn't replicate the problem. A screen shot or your full markup and CSS would really help.

I can only assume it's a problem with inheritance.

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 47 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.