Current Assignment(s)

A8: Positioning
Due: Recommended by Monday, 6.11

"The Box Model"

Topic 10 Overview

01. Sizing

Min and Max Values

02. Overflow

Dealing with Spills

Overflow in Practice

03. Borders

Borders in Practice

04. Padding

Giving Some Cushion

Padding in Practice

05. Margin

Adding Separation

Margins in Practice

06. Display

What You See...

Display In Practice

07. Hidden

...And What You Don't

Hiding in Practice

08. Position

Placement on the Page

Normal Position

Relative Position

Absolute Position

Positioning in Practice

09. Z-Index

The Z-Index and Layering

Z-Index in Practice

10. Float

Float in Practice

The Z-Index and Layering

On the last page, we learned how to place elements “wherever” we want. We even learned how to place elements over other elements, thereby, blocking those elements.

The z-index property allows developers to specify which elements should be placed on top of other elements. The z-index property takes an integer number as its value (i.e. -1000 to 1000). Those elements with higher z-index values will be drawn on top elements with lower values.