Skip to Content
Learn
The Box Model
Height and Width

An element’s content has two dimensions: a height and a width. By default, the dimensions of an HTML box are set to hold the raw contents of the box.

The CSS height and width properties can be used to modify these default dimensions.

p { height: 80px; width: 240px; }

In this example, the height and width of paragraph elements are set to 80 pixels and 240 pixels, respectively — the px in the code above stands for pixels.

Pixels allow you to set the exact size of an element’s box (width and height). When the width and height of an element are set in pixels, it will be the same size on all devices — an element that fills a laptop screen will overflow a mobile screen.

Instructions

1.

Add a height of 700 pixels to #banner.

2.

Set .pull-quote width to 350 pixels.

3.

Set the #banner .content h1 width to 400 pixels.

Folder Icon

Take this course for free

Already have an account?