CSS IDs





 

IDs are similar to classes, except once a specific id has been declared it cannot be used again within the same (X)HTML file.

I generally use IDs to style the layout elements of a page that will only be needed once, whereas I use classes to style text and such that may be declared multiple times.

The main container for this page is defined by the following.

<div id=”container”>
Everything within my document is inside this division.
</div>

I have chosen the id selector for the “container” division over a class, because I only need to use it one time within this file.

Then in my CSS file I have the following:

 

[css autolinks=”false” classname=”myclass” collapse=”false” firstline=”1″ gutter=”true” highlight=”1-3,6,9″ htmlscript=”false” light=”false” padlinenumbers=”false” smarttabs=”true” tabsize=”4″ toolbar=”true” title=”CSS CODE”]

<span class="paths">#</span>container{
width: 80%;
margin: auto;
padding: 20px;
border: 1px solid #666;
background: #ffffff;
}

[/css]

 

You will notice that the id selector begins with a (#) number sign instead of a (.) period, as the class selector does.