CSS Tips, Tricks and Trouble Shooting
Below are common CSS (Cascading Style Sheets) articles. Each article is geared towards either providing some sort of tip, trick or help with trouble shooting issues.
Learn how to create box shadows around any HTML element you want.
The margin attributes in CSS doesn't necessarily have to be a positive value. See an example of how to overlap two div's with negative CSS margins.
Text padding in CSS defines the distance between the borders of the container and the content inside.
With the CSS "clear" property you can instruct the browser to allow or disallow floating on a specific side of a block element.
Don't settle for the dull circle markers in your unordered HTML lists or the default numbering in the ordered ones. You can style your lists with CSS to get pretty much any output.
CSS3 allows you to do some nice image modifications you could only have done with an image editor in the past.
CSS3 allows you to do some neat animation effects which you could have only done with Flash or some third party plugin before.
You can define custom CSS3 font families to use in your design. Upload your TTF or OTF file to your host and apply the CSS properties.
Shadows around DIVs are no longer novelty with CSS3. Learn how to create the effect here.
CSS3 allows designers to get blocks with rounded corners without the corny use of images or nested DIV's from previous versions.
Before CSS3 you had to use background images to get gradient effects. Fortunately you can do it with a simple CSS hack now.
CSS Flashing Text can be used to over-emphasize a certain paragraph or word. You can do it with a single line of CSS.
You may sometimes need to use non-standard fonts with your design. Here is a way you can embed standard .ttf fonts with CSS.
If you want to display blinking text in css on your page and don't want to use the deprecated BLINK tag, here is a way to do it.
Separating code from presentation should be a well-known practice to all designers. Here is how to link an external CSS file from within your HTML code.
Before the emergence of CSS, designers had little tools to control transparency of images. This is no longer the case -- CSS3 gives you the tools to do it.
The color of the browser's scroll bar can be changed with a little CSS tweaking. Here is how to do it.
Rather than overriding CSS styles inline, here's an approach that will help you maintain your code over the long run.
Using the "border" property of the "img" tag to set borders to zero is cumbersome and difficult to maintain.
Dotted borders around a DIV tag are a nice effect you may want to use in your design.
You can show or hide images, paragraphs or entire sections with a few CSS hacks. Learn how to do it here.
This short tutorial will assist you with various ways of displaying blocks of text with CSS.
The looks of the left border of a block can be customized with CSS.
This article will show you how to customize the borders of a cell with CSS.
Classes and IDs in CSS are often confused. If you aren't sure where to use each, read this short tutorial.
If you design HTML emails, you will find that the HEAD tag is stripped. You will have to place all relevant bits of code (including CSS) inside the BODY tag.
You can change the html font size with the CSS property font-size. Learn how to do it here.
You can change the position of an HTML DIV with the use of CSS (Cascading Style Sheets). It's very simple and we'll show you how to do it here with margin.
Sometimes you don't want one of those annoying underlines for specific links on your page, which is understandable. Learn how to remove that line with CSS.
Learn how to set a css span width. Find an easy to understand HTML and CSS example inside.