make web site 1 by codecademy

Introduction

A web page is a collection of HTML elements. CSS can control the design of an element, like its color, font, and spacing.

CSS can also control where an element sits on a page to create a page layout.

For example, the layout to the right has a top navigation bar, a large feature element, a grid of images, and then three pieces of supporting content.

What CSS properties are available to move elements around and create page layouts? Here are three common CSS properties.

display

CSS treats HTML elements like boxes. A box can be "block" or "inline".

• Block elements display on a new line (e.g.,h1, p, ul, li).

• Inline elements display on the same line as their neighboring elements (e.g., img, a)

It's possible to change whether a box is block or inline by using the display property.

position

The position property is used to move an HTML element to a precise position on the page.

By setting position: relative, you can use the CSS properties top, left, bottom, andright to shift an element away from where it would have normally appeared on the page.

float

The float property moves an element to the far left or far right of the page.

For example, setting float: right pulls an element to the far right side of the page, and the surrounding text wraps around it.