O'Reilly logo

Foundation Fireworks CS4 by Hugh Griffith, Matthew Keefe, Chuck Mallott, Matt Heerema, Craig Erskine, Grant Hinkson

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

13.4. Writing the CSS

There are many, many ways to create the CSS for our page, but we've decided to go with an image replacement technique that will hide the HTML text and replace it with selected portions of our exported nav.png bitmap. This technique involves displacing the text with a negative text-indent value that will force the text off of the web page without causing horizontal scrollbars. With the text safely hidden from sight, we can replace the blank anchor tag with a background image. Here's what the CSS looks like:

<style type="text/css">
#nav,#nav li {
margin: 0;
padding: 0;
list-style: none;
}
#nav li { text-indent: −9999px; } #nav a { margin: 0 20px 0 0; background: url(nav.png); width: 100px; height: 28px; display: block; float: ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required