Weird "grey" at side of the block?

HTML & CSS
1

Hi,

I’m trying to come up with a “christmas countdown” clock, but have come up across a bit of a weird one:

http://www.mywebsitedesignersblog.com/examples/countdown/christmas.html

As you can see in the attached image, there is a weird “grey” block thats showing up. The weird thing though, is that its fine in Chrome - but not IE or FF

The image sprite its using is: http://www.mywebsitedesignersblog.com/examples/countdown/christmas1.jpg

Any suggestions are much appreciated - its driving me nuts :frowning:

TIA

Andy

2

Your attachment is still pending approval, but if you mean what I think you mean, then deleting the border does the trick for me in Firefox 7 on Linux. I haven’t tested it in anything else.

.hasCountdown {
    background-color: #EEEEEE;
    [COLOR="#FF0000"]border: 1px solid #CCCCCC;[/COLOR] /*remove this line*/
}
3

Hi,

Thanks - I can’t seem to find that CSS though? The only CSS I have, is:


#imageLayoutWrapper { width: 350px; }
#imageLayout2 span { display: block; float: left; width: 29px; height: 50px; background: url(christmas1.jpg) no-repeat 0px 0px; } 
#imageLayout2 span.image0 { background-position: -0px 0px; } 
#imageLayout2 span.image1 { background-position: -29px 0px; } 
#imageLayout2 span.image2 { background-position: -58px 0px; } 
#imageLayout2 span.image3 { background-position: -87px 0px; } 
#imageLayout2 span.image4 { background-position: -116px 0px; } 
#imageLayout2 span.image5 { background-position: -145px 0px; } 
#imageLayout2 span.image6 { background-position: -174px 0px; } 
#imageLayout2 span.image7 { background-position: -203px 0px; } 
#imageLayout2 span.image8 { background-position: -232px 0px; } 
#imageLayout2 span.image9 { background-position: -261px 0px; } 
#imageLayout2 span.imageDay { background-position: -290px 0px; } 
#imageLayout2 span.imageSep { background-position: -319px 0px; } 
#imageLayout2 span.imageSpace { background-position: -348px 0px; }

TIA

Andy

4

Oh no, you have a lot more CSS on that page : )

http://www.mywebsitedesignersblog.com/examples/countdown/jquery.countdown.css

5

The CSS you’ve quoted is the embedded styles for that page. As Stomme poes has pointed out, there is a separate stylesheet for the jQuery, called jquery.countdown.css. You’ll find the border declaration at the beginning of that.

6

Ah man - now I feel stupid <G> Serves me right trying to code before my first coffee!

Removing that “border” bit worked like a charm- Thanks :slight_smile:

Andy

7

[ot]

I’ve made many coding mistakes in my time, but that’s one I’m never likely to make. I’m completely unable to function without breakfast and at least one large mug of coffee. :lol:[/ot]

8

haha I tend to try and do a couple of emails before my coffee - but after that, I think I better go back to a nice cuppa to get the day started =)