Table of Contents


In the lesson we will talk about typical CSS constructs, which are very common for a developer in various projects. A convenient list in order to simply copy a typical piece of code to your file at the right time and add small modifications in accordance with the sketch of the project.

Rounded corners:

popular browsers today support rounding corners, you can achieve them on your site as follows:


Fix Internet Explorer 6/7 Double Indentation/Margin Bug:


A known bug occurs when a floating element aligned to the right/left has a value for the margin/padding property. To fix it, you need to add display: inline .



Font property definitions:

makes life much easier when font properties are collected in one line:



Change the color of the selected text:

In code, you can change the highlight color of the text to red, but the font color of the selected text remains white:


Centering a div element of unknown width:


Because IE6 and IE7 do not support the display:table property, you can use an alternative method:





The advantage of using the min-height attribute:

IE6 treats the last property in the same way that other browsers perceive the min-height property:


Reset CSS styles:

To start creating, you need to create a CSS file with the reset code, which can be selected from a very extensive list.

CSS3 properties for text and element shadows, gradients, and transformation:

Shadows that support different browsers:


Text shadow as a one-pixel-wide white stroke:



A good gradient for the background:



Transformation to share with the hover pseudo-class:


Replacing text with an image:

This technique allows you to save text for search robots, while the image will be displayed on the page:



This lesson is over, of course there are more of these constructions, and each has its own selection, leave comments, and contribute to the development of the lesson.