HTML <div> Tag — Content Division Element

Description

The HTML <div> element is a generic container for flow content. It has no effect on the content or layout until styled using CSS.

It is the most commonly used element for grouping content and creating layout structures. The <div> element is a block-level element, meaning it starts on a new line and takes up the full width available.

CSS Display:block

Syntax

<div>Content goes here</div>

Popular Attributes

Attribute	Description
id	A unique identifier for the element. Used for CSS styling, JavaScript targeting, and anchor links.
class	Specifies one or more CSS class names for styling the element.
style	Applies inline CSS styles directly to the element.

This element also supports global HTML attributes such as class, id, style, data-*, and more.

Examples

Basic Container

<div> <h2>Section Title</h2> <p>Section content goes here.</p> </div>

A simple div wrapping related content together.

Styled Container

<div style="background-color: #eceeff; padding: 16px; border-radius: 6px;"> <p>This div has custom styling applied.</p> </div>

A div with inline styles for background color, padding, and border radius.

Notes

While <div> is versatile, prefer semantic elements like <article>, <section>, <nav>, or <main> when the content has a meaningful purpose. Use <div> only when no semantic element is appropriate.

Related Tags

Last updated: 7th April 2026