CSS Cookbook

Christopher Schmitt has been working on the Web since 1993. He is the principal of Heatvision.com, Inc., a new media design firm, and resides in Orlando, Florida. While an undergraduate at Florida State University, Christopher interned for both David Siegel and Lynda Weinman in the mid-90s, wrote for local newspapers about web sites and design, and won the prestigious High Five award.

Foreword Preface 1. Web Typography 1.1 Specifying Fonts and Inheritance 1.2 Specifying Font Measurements and Sizes 1.3 Enforcing Font Sizes 1.4 Setting a Simple Initial Cap 1.5 Setting a Larger, Centered Initial Cap 1.6 Setting an Initial Cap with Decoration (Imagery) 1.7 Creating a Heading with Stylized Text 1.8 Creating a Heading with Stylized Text and Borders 1.9 Stylizing a Heading with Text and an Image 1.10 Creating a Pull Quote with HTML Text 1.11 Creating a Pull Quote with Borders 1.12 Creating a Pull Quote with Images 1.13 Setting the Indent in the First Line of a Paragraph 1.14 Setting the Indent of Entire Paragraphs 1.15 Setting Text to Be Justified 1.16 Styling the First Line of a Paragraph 1.17 Styling the First Line of a Paragraph with an Image 1.18 Creating a Highlighted Text Effect 1.19 Changing Line Spacing 2. Page Elements 2.1 Eliminating Page Margins 2.2 Coloring the Scrollbar 2.3 Centering Elements on a Web Page 2.4 Setting a Background Image 2.5 Creating a Line of Background Images 2.6 Placing a Background Image 2.7 Fixing the Background Image 2.8 Placing a Page Border 2.9 Customizing a Horizontal Rule 2.10 Example Design: Setting Up a Dynamic Splash Page 3. Links and Navigation 3.1 Removing Underlines from Links 3.2 Setting Text to Blink 3.3 Setting Style Decorations Other Than Underlines 3.4 Changing Cursors 3.5 Creating Rollovers Without JavaScript 3.6 Creating Nongraphical Menus with Rollovers 3.7 Creating Collapsible Menus 3.8 Building Horizontal Menus 3.9 Creating Breadcrumb Navigation 3.10 Creating Image-Based Rollovers 3.11 Designing a Dynamic Visual Menu 3.12 Creating Contextual Menus 4. Lists 4.1 Changing the Format of a List 4.2 Writing Cross-Browser Indentation in Lists 4.3 Creating Custom Text Markers for Lists 4.4 Creating Custom Image Markers for Lists 4.5 Creating Inline Lists 4.6 Making Hanging Indents in a List 4.7 Moving the Marker Inside the List 5. Forms 5.1 Setting Styles for Input Elements 5.2 Setting Styles for textarea Elements 5.3 Setting Styles for Select and Option Elements 5.4 Creating Form Buttons 5.5 Setting Up a Submit-Once-Only Button 5.6 Designing a Web Form Without Tables 5.7 Sample Design: A Login Form 5.8 Sample Design: A Registration Form 6. Tables 6.1 Setting the Cell Spacing 6.2 Setting the Borders and Cell Padding 6.3 Setting the Styles Within Table Cells 6.4 Removing Gaps from Table Cells with Images 6.5 Setting Styles for Table Header Elements 6.6 Sample Design: An Elegant Calendar 7. Page Layouts 7.1 Developing Hybrid Layouts Using HTML Tables and CSS 7.2 Building a One-Column Layout 7.3 Building a Two-Column Layout 7.4 Building a Two-Column Layout with Fixed-Width Columns 7.5 Creating a Flexible Multicolumn Layout with Floats 7.6 Creating a Fixed-Width Multicolumn Layout with Floats 7.7 Creating a Flexible Multicolumn Layout with Positioning 7.8 Creating a Fixed-Width Multicolumn Layout with Positioning 7.9 Designing an Asymmetric Layout 8. Print 8.1 Creating a Printer-Friendly Page 8.2 Making a Web Form Print-Ready 8.3 Inserting URLs After Links 8.4 Sample Design: A Printer-Friendly Page with CSS 9. Hacks and Workarounds 9.1 Hiding Certain Styles from Netscape Navigator 4.x 9.2 Delivering Alternative Values to Internet Explorer 5.x for Windows 9.3 Removing Web Page Flicker in Internet Explorer 5.x for Windows 9.4 Keeping Background Images Stationary in Internet Explorer 6 for Windows 9.5 Keeping CSS Rules from Internet Explorer 5 for Macintosh 10. Designing with CSS 10.1 Enlarging Text Excessively 10.2 Creating Unexpected Incongruity 10.3 Combining Unlike Elements to Create Contrast 10.4 Leading the Eye with Contrast 10.5 Building a Panoramic Image Presentation 10.6 Combining Different Image Formats 10.7 Making Word Balloons 10.8 Emphasizing a Quotation 10.9 Placing a Drop Shadow Behind an Image Appendix: Resources Index