CSS articles, tools, tips and tricks
Have you been wondering how to accomplish a special task with CSS? Perhaps you find the answer amoung our collection of CSS articles, tools, tips or tricks.
If you have written a CSS article yourself, you are welcome to make your work known by submitting your CSS article, tool, tips or tricks to Strictly CSS.
A CSS Starter File
Nearly all CSS-styled sties will need a basic file like this one to be off to a proper start. This can save you some time.
Accessible fold-out menu using CSS and Javascript
This tutorial will explain in detail a technique for creating accessible, standards compliant, cross-browser, gracefully degrading multi-level fold-out menus using a minimum of javascript while relying...
Building Basic Block Links
Learn how to make block-displayed links for your next navigation menu.
Creating a Star Rater using CSS part two
Many of you have seen comments and reviews on sites such as Netflix and Amazon. Most of these reviews, as in Amazon’s case or Movies, as in Neflix’s case come with a handy dandy rating. Many...
Cross browser multi page photograph gallery
This Cross browser multi page photograph gallery uses my multi-page layout system but includes images instead of text. This version does not use javascript but is pure CSS and still works...
CSS bar graphs
The article demonstrates three different CSS graph types;
CSS breadcrumb using background image
Breadcrumbs is a term used to describe hierarchical links that tell the visitor where he/she currently is on your site. Visually breadcrumbs are just links with some sort of separator...
CSS dropdown menus
Son of Suckerfish Dropdowns is a lightweight, search engine friendly and accessible CSS-based dropdown menu. The Son of Suckerfish Dropdown also handles Multi-level dropdowns.
CSS fluid layouts with faux columns
Faux columns is a method of making CSS columns appear equal in length, regardless of the content that they contains. The method was originally developed for fixed width layouts,...
CSS imageless buttons
These buttons are created, using pure CSS. No images are involved, just CSS and the code is flexible so that it is easy to use. This implementation is designed to be flexible...
CSS multiple column lists
This tutorial shows how to make a list display as multiple columns of list items, rather than as a single column or horizontal row. This can be a big space saver in...
CSS rounded box generator
Creating a CSS layout with rounded corners can be a littel bit tricky. With this CSS rounded box generator this can be done with the click of a button.
CSS: Double List
Make a simple unordered list which will display as two columns.
CSS: Faux columns
One of the questions often asked is the following: How to get the column’s background color to extend all the way down the page? It’s a simple concept many...
CSS: MapPop
Combine an accessible CSS image map and pure CSS popups into one very useful feature for your site. This is fairly complex CSS made simple.
CSS: Smart Corners
Learn how to make rounded corners on boxes for your site. These use tiny images but employ a much more semantic markup than some of the other non-image options...
CSS; Simple Tabs
Create a simple tabbed-navigation menu for your site. Completely accessible.
Designing Accessible Navigation
This is an article outlining the characteristics of accessible website navigation. It emphasizes the advantages of CSS and standards-based HTML in...
Different font color than line-through color with CSS
I got a question if it was possible to make the linethrough in red and still have the font color in black. The answer to this is that it's not possible,...
Fast CSS rollovers without preload
When using CSS image rollovers, two, three, or more images must be loaded (and often be preloaded for best results). In this article you are...
Flexible floated two column CSS layout
There are many tutorials about how to make two column CSS layouts, and you have maybe seen one that looks similar. Anyway, here is a solution...
footerStickAlt: 100% height CSS-layout with footer
A web page footer positioned either at the bottom of the browser window or at the bottom of the Web page – whichever is visually lowest,...
Forms with style - Fieldsets & Labels
Designing forms for the web can be both fun and frustrating, and it certainly requires a great deal of persistence and determination....
Horizontal and tabbed CSS menu with sub menu
This article explains and shows examples of horizontal CSS menus with sub menus (or nested lists as this is also called). The menus...
How to center a tabbed horizontal CSS menu
This article shows and explains a different method for centering a horizontal aligned tabbed CSS menu without using any width...
