HTML Tutorial Div Tags

The best way to describe a div tag is to think of two separate entities, first we have the div tag itself of which will be located in the HTML source code. This code is rendered useless itself and will float in the code making absolutely no change to your web page. This is where the second entity comes into play, the div tag is floating in your page in a specific area, and you can now control the appearance of that div tag using CSS.

With that knowledge the best way to quantify both is to imagine the div tag as an area, whereas the CSS is the controls to that area. The CSS will control the overall look and appearance of that particular div tag, the CSS will control the width, height, font type, font colour, background and everything to do with that specific area.

As an example we will demonstrate a footer on a web page, and display the associated CSS.

Div Tag for footer

<div id=”footer”> your footer content will go here and the look of this will be controlled using CSS </div>

CSS for footer

Below is the CSS for footer for this web page at

#wrapper #footer {
width: 100%;
clear: both;
background-image: url(../images/sky-footer.png);
background-repeat: no-repeat;
height: 310px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #C4C3BF;

comments powered by Disqus