Category Archives: CSS

CSS Image Maps: A Beginner’s Guide Advertisements

Custom style sheet and templates for NextGen Gallery (with special instructions for child themes)

NextGen Gallery is a great plugin for your WordPress site’s galleries. But often you would like to customize its look to suit your needs. Here’s how: Create custom template files for NextGen Gallery: Custom templates are PHP files that can be stored in the folder /nggallery/, which you can create inside your theme directory. NextGEN […]

a:hover background doesn’t work in Safari (but works fine in IE and Firefox)

I didn’t know what the problem was. I had exactly the same CSS for the navigation menu of another site of mine, and it worked perfectly fine in all browsers. Somehow, it didn’t for the site I searched and searched all over the Internet looking for an answer, a solution. Some said it was […]

Make Footer Stick to the Page Bottom ============================== The HTML code: <div id=”container”> <div id=”content”> <p>Main content.</p> </div> </div> <div id=”footer”> <p>Footer content.</p> </div> The CSS: html, body { height:100% } #container { position:relative; height: 100%; min-height:100%; height: auto !important;  /* for IE6 as it doesnt understand min-height */ margin-bottom: -100px; /* assuming your footer height is 100px */ } […]

CSS: style tables

CSS: style Forms and Search fields

CSS: Cross-browser Rounded corner HTML elements using CSS3 This is a behavior htc file for Internet explorer to make CSS property ” border-radius ” work on all browsers. At present, all major browsers other than IE shows curved corner by adding the first 4 lines of css: .curved { -moz-border-radius:10px; /* Firefox */ -webkit-border-radius:10px; /* Safari and chrome */ -khtml-border-radius:10px; […]

CSS: text shadow

IE: { filter: Shadow(Color=#000000, Direction=135, Strength=2); } Safari and Firefox: { text-shadow: 2px 2px 2px #000000; } ============================== Creating Cross Browser Compatible CSS Text Shadows Create a Letterpress effect with CSS test shadow

CSS: font-weight values The following two examples illustrate the process. Assume four weights in the “Example1” family, from lightest to darkest: Regular, Medium, Bold, Heavy. And assume six weights in the “Example2” family: Book, Medium, Bold, Heavy, Black, ExtraBlack. Note how in the second example it has been decided not to assign “Example2 ExtraBlack” to anything. Available faces | Assignments […]

Tutorials: Premium WordPress theme design

Part I: Part II: