Divs

Divisions are what they are. If you are using tables this is the replacement. And a good one!

So a div starts by
<div>and has a regular end tag </div> This is valid for XHTML.
Divs use id and classes which you specify like this class=”name”
id=”name” And this is also XHTML valid.

When making your layout you only have to use the div tag and specify its class or id. The rest you can leave up to an external style sheet and you don’t have to go to edit a bunch of pages.

You can do background image and color, borders, color, text-align, height, width, margin, padding, font, and more but these are the basics. I will show you how to do these things in CSS.

So taking it from the top…

background image or color

background-image: url('url here');
background-color: #fff

You can’t use both in the same div.

Borders

border: #fff solid 5px
border-right: #fff solid 5px


Remember you can specify border right, left, bottom and top.

Color
This especially tells you the color of the text in the div.

color:#fff;


Text-align
The basic uses of text align is center, right and left.

text-align:center;


You can specify height and width like…

width:233px;
height:233px;

or…

width:auto;
height:auto;

Making the height auto means that height is defined by how long the content is. The width is defined by how wide the content is or how wide a primary div is. (Meaning if you put this div in another the current div will be as long as the first one.)

Margin and padding
Margin and padding gives you space or margin. Margin being on the outside of the div and padding on the inside.
Margin and padding code is simillar to borders. You have margin, margin-right, margin-left, margin-bottom, margin-top. It is the same for padding. padding, padding-right, padding-left, padding-top, padding-bottom.

margin:15px
margin-right:15px
padding: 15px;
padding-right:15px;


Font
Ahhh font. So so important!
You need to specify at least 2 different fonts(one for backup if a particular browser doesn’t support the first), the size, the font weight(if it is bold, italic, or normal)

font: normal Gerogia, Verdana 50px

When specifying the text size you can use pixles or percentage.

Those are some of the basic attributes for divs. If you have any problems or see any errors please contact me. I don’t want my tutorials to have any wrong coding.