Web Design with HTML and CSS

A brief history of layout techniques on the web

Lesson 7, Introduction to CSS Layout 161

2 Return to your text editor, locate the rule in your CSS for the sidebar, and add the
following code (highlighted in red):
#sidebar {
fl oat:left;
width:300px;
background-color:#CCC;
padding:0px 20px 0px 20px;
}

Remember that this is a CSS shortcut and you should read the values in a clockwise
manner. The fi rst value (0px) is the top padding, the second value (20px) is the right
padding, the third value (0px) is the bottom padding, and the last value (20px) is the left
padding. Save the page and preview it in your browser.

Using the guide as a reference you can see the width of the sidebar has expanded by 40 pixels