Flow example 2

This is a progressive example examining document flow. The example changes flow properties for paragraphs, which uses block-level boxes by default.

HTML

<p> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>

CSS

/* 
Try this for p elements:  
1. Change margin and note left, right, top, bottom margins
2. Replace display: inline; with display: block;
3. Add width and height properties with small values
4. Read http://www.w3schools.com/cssref/pr_pos_overflow.asp
5. Set overflow property.
6. Modify width and height to reasonable values
7. Replace display:block; with float:left;
 */
p {
    display: block; 
    background-color: palegoldenrod; 
    color: black; 
    margin: 0px;
}

body {
    margin: 0;
    padding: 0;
    border:0;
    background-color: steelblue;
}