Divs - width of an element, it no longer expands to fit the...

Info iconThis preview shows pages 1–2. Sign up to view the full content.

View Full Document Right Arrow Icon
5/25/10 2:25 PM Divs Page 1 of 2 http://www-rcf.usc.edu/~trinagre/itp104/lectures/Divs.html Divs <div> elements are used to group related elements together into logical sections. Creating logical sections can help you identify the main content areas, header, and footer of your page. <div> elements are often described as "containers". Not only do they act as logical containers that you can use to hold a bunch of related elements together, they can act as graphical containers when we use styles and use them for positioning. You can use <div> elements to group elements together that need a common style. Use nested <div> elements to add further structure to your files for clarity or styling. Once you have grouped together sections of content with <div> elements, you can style the <div> s just like you would any other block element. For example, you can add a border around a group of elements using the border property on the <div> they are nested in. The width property sets the width of the content area of an element. Once you set the
Background image of page 1

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
Background image of page 2
This is the end of the preview. Sign up to access the rest of the document.

Unformatted text preview: width of an element, it no longer expands to fit the entire width of the browser window. The total width of an element is the width of the content area, plus the width of any padding, border, and margins you add. You can use descendant selectors to select elements nested within other elements. For instance, the following descendant selector selects all &lt;h2&gt; s nested in &lt;div&gt; elements: div h2 { . .. } Examples View the source for this page to see how I put the main content into a div and add styles to change the color of the background and set the border. View the source of OneColumnWithHeaderFooter.html to see an example of using divs to create one main section with a header and a footer. View the source of TwoColumnsWithHeaderFooter.html to see an 5/25/10 2:25 PM Divs Page 2 of 2 http://www-rcf.usc.edu/~trinagre/itp104/lectures/Divs.html example of using divs to create a vertical navigation bar on the left, main content, a header, and a footer. Updated March 2010...
View Full Document

This document was uploaded on 05/25/2010.

Page1 / 2

Divs - width of an element, it no longer expands to fit the...

This preview shows document pages 1 - 2. Sign up to view the full document.

View Full Document Right Arrow Icon
Ask a homework question - tutors are online