Let’s assume you want to create a gradient background that starts at the top of the page and finishes at the bottom of your page header, i.e. is 100px tall. You can do this with a combination of CSS3 rules and avoid those ugly background images.
Category Archives: background
Adding style to your rel attributes with CSS
View the finished example: Adding style to your rel link. There’s a little attribute in HTML links that is starting to get a bit of attention lately. The “rel” attribute is a sparsely defined attribute that applies some meta information about a link’s relationship to other documents. Unfortunately, this information is usually hidden from your […]
Image sprites – flexible and accessible packages
User generated ratings and reviews are an important part of all Yahoo! sites. You can find them on just about every page of Yahoo! Tech. It was important for us to develop a ratings presentation device that was easy to code, accessible, flexible, and as light-weight as possible. Our final design uses a combination of […]
IE7 background sprite bug – the saga continues
I’ve been able to narrow down my problem with IE7b2 and background sprites. However, I still have not been able to create a stripped down test page that consistently mis-behaves. So my observations, while not scientific, could save you some hours of debugging. Internet Explorer 7beta2 is not treating transparent png background images correctly. It […]
IE7 passes the sprite test
I came across an issue with Internet Explorer 7 beta displaying the rating stars incorrectly in Yahoo! Tech. After doing some testing, I realized the browser was measuring the sprite image from the bottom up, rather than the top down. This is a significant issue. I had to create a new set of rules in […]