Did you find this useful?
Socialize it today.


HTML Div Element

Friday, March 02, 2012

The <div> element is basically used as a container for other elements. When HTML first began, web designers only had two choices with regard to the layout of a webpage. The web designer either used tables or frames to create structure on a page. The div element provides a third option. The div is the best option since this element can contain every just about every other type of html element. For those who learned how to use tables first, the div may be a little more challenging to use. However, if you are new to both divs and tables, using divs will be easier to learn and use mainly because of the flexibility especially when considering styling. Here is an example on how to use a div.



<div style="background: #014DA1; color:#FFFFF;">
 <strong>This is a div!</strong>
</div>

This is a div!



Some things to quickly note about the div element. As this is a block-level tag, most browsers will add extra spaces before and after the element, similar to the paragraph element. When possible, use divs instead of tables. Divs load more quickly in browsers, are more flexible with regard to styling.  They are also more SEO friendly so web crawlers can work well with the content within a div. Also, keep in mind that the div element is not a replacement for the paragraph element. Divs are not used for creating paragraphs. They are mainly used to create section within a document.  The div element is also supported in HTML 5.

Div Attributes

The div element supports standard attributes, such as class, id, style, title, dir, and lang. Anything else related to styling should be handled by CSS. We will be covering styling techniques for the div element in the CSS series of articles. You can practice your HTML skills by using our online HTML Editor.

Please help us spread the word by socializing it today!

email contact us

Did you find something wrong with the information on this page? Please take a moment to report it to us so that we can continue to improve the quality of the information on this site. Click here to report an issue with this page.



Recommended Books & Training Resources

Creating Web Pages Simplified HTML CSS: The Complete Reference HTML CSS and JavaScript Editor