This documentation is archived and is not being maintained.

Creating DIV and SPAN Elements

Visual Studio .NET 2003

A <DIV> element is used on an HTML page to enclose a block of HTML elements. Like a <P> paragraph, it occupies a rectangular area, and can include CSS style attributes. A style can be inserted directly into a <DIV> element, or it can be referenced from a style sheet via a <CLASS> or <ID> attribute. For more information, see Building CSS Styles.

A <SPAN> is an inline element typically used to alter the style of certain words within a paragraph or <DIV>. You can first apply a CSS style to a <DIV> that formats all of the text it contains in a certain font and color. Working in HTML view, you can then edit the text within the <DIV>, enclosing certain words within <SPAN> elements formatted to give those words special emphasis. A <SPAN>, unlike a <DIV>, flows with the text around it.

Note   To use CSS styles and enable the <SPAN> element, set the targetSchema property of the active document to a Web browser that supports HTML 4.0 or later and CSS styles.

To create a <DIV> element in Design View

  • Drag one of the following items from the HTML tab of the Toolbox onto the Design view surface:

    Flow Layout Panel

    Grid Layout Panel


Adding any of these items inserts a <DIV> element into your Web document with certain attributes preset. You can then edit this new element as needed. For more information, see HTML Tab, Toolbox and Positioning HTML Elements in Design View.

To insert other elements within a <DIV> or <SPAN> element

  1. To display graphic markers for <DIV> and <SPAN> elements on the Design view surface, choose Details from the View menu or select the Show Details icon on the Design toolbar.
  2. Place the insertion point at the desired location within the <DIV> or <SPAN> element.
  3. Double-click the desired element in the Toolbox. It will be inserted at the current location.

See Also

DIV Element | DIV Object | SPAN Element | SPAN Object | HTML Div Controls | HTML Tab, Toolbox | Document Outline Window | Style Builder Dialog Box | Navigating in the Document Outline Window | Properties Window | HTML Designer | Editing HTML