• KeyDog
  • KeyDog
  • Global Moderator
  • Offline
  • Registered: 2008-12-12
  • Posts: 1,693

Topic: css coding question background: transparent url images colliding

I have two css files and the 1.css #2  arrow.png is colliding with #1 .star rating  'rate-star.png' in IE and firefox, but no Chrome. Anyone got any ideas why the arrow.png would be repeat-appearing over the stars which are coded correctly to repeat? (it's not directly related to punbb, that's why I'm posting here)

1.css #2

li 
{
background:transparent url(../images/arrow.png) no-repeat scroll left top;
}

2.css #1

.star-rating, .star-rating a:hover, .star-rating a:active, .star-rating a:focus, .star-rating .current-rating {
background:transparent url(images/rate-star.png) repeat-x scroll left -1000px;
}

Solution

the css of the ajaxpopform didn't have li background: none set .... so the li image from my other main .css was showing... you get rid of it by changing the
.star-rating li {
display: inline;
background: none;
}

  • Registered: 2010-05-04
  • Posts: 2

Re: css coding question background: transparent url images colliding

That's very good that you had define the problem and solution  also. It is always that when you make any changes in code then the effect is shown of the main page or the first modification you had did, still is was a nice information. Good job.

Mistakes are the portals of discovery.