Posted: 1 year ago in Tutorials
Tutorial that starts with a photoshop file and finishes with semantic HTML and CSS. You’ll learn how to create an advanced CSS navigation menu using hover and position properties.
The finished product will render properly in all major browsers including Firefox, Safari, IE7/IE8, Opera, and Google Chrome. Due to IE6 and its lack of support for the hover property (other than on anchor elements), there’s a tiny bit of javascript to make it work…
Read More: Create an Advanced CSS Menu Using the Hover and Position Properties
Posted: 1 year ago in Tutorials
How to create drop down menus that behave like drop down lists using just CSS. The menu structure is just simple nested unordered lists. Showing/hiding child menus is done with simple CSS: ul > li:hover ul. By using this selector we can define behavior of all child menus…
Read More: Create dropdown menus with CSS only
Posted: 1 year ago in Articles
Resetting your styles, commonly referred to as CSS Reset or Reset CSS is the process of resetting (or more accurately – setting) the styles of all elements to a baseline value so that you avoid cross-browser differences due to their built-in default style settings. By resetting your styles, you avoid defaulting to the browser’s built-in styles, which differs from browser to browser…
Read More: Resetting Your Styles with CSS Reset
Posted: 1 year ago in Tools
Other CSS frameworks try to do everything – grid system, style reset, basic typography, form styles. But complex systems are, well, complex. Looking for a simple, lightweight approach that doesn’t require a PhD? Meet The 1Kb CSS Grid…
Read More: The 1Kb CSS Grid – A simple, lightweight grid framework
Posted: 1 year ago in Tutorials
Here’s a practical tutorial explaining how to undetsand and use CSS sprites in your own projects. There’s a ton of image spriting articles around already. This one concentrates on practical demos and examples to help noobs get up to speed quickly…
Posted: 1 year ago in Articles
Whether you are pro web designer or someone with little HTML and CSS knowledge, pre-made CSS Templates can come in really handy. They can save you a lot of coding time. Here are 35 of the best websites where you can download free CSS templates…
Posted: 1 year ago in Tutorials
In-depth article that shows how you can use PHP to automatically compress CSS and javascript files to help speed up your site….
Posted: 1 year ago in Tutorials
Designing within a grid system involves defining the material you are going to work with, defining the page size, making a proportional grid onto the space and then fitting your design into the grid. Having a good grid system will speed up the work process so it’s always wise to spend a little time on the grid first.
Learn how to make grids that you can use to create mock ups in Adobe Illustrator…
Posted: 1 year ago in Code
Really useful HTML page that you can download and use to test that your CSS file covers all the common HTML tags….
Read More: HTML Test Page for CSS Style Guide
Posted: 1 year ago in Tutorials
Read More: Simple CSS shiny progress bar technique