CSS Positioning
See it to believe it

All right! Now that you know all about CSS, it's time to learn the last (but certainly not least) major piece of the puzzle: positioning.

Controlling the position of HTML elements allows you incredibly fine control over how your pages look. No longer will your <div>s sit directly on top of one another! (Unless you want them to.)

As we mentioned, elements populate the page in what's known as the CSS box model. Each HTML element is like a tiny box or container that holds the pictures and text you specify.

Check out the image in the Result tab: that's what the box model looks like! (We'll cover the details of margins, borders, and padding in the next section.)


See for yourself—use the universal selector to draw a 1px dashed border of hex color #0000FF around every HTML element.

Stuck? Get a hint! Hint
Get live, fast support from Codecademy Advisors when you get stuck. Learn more.

The universal selector can be used to apply CSS styling to every element on the page. Here we create a two-pixel wide solid black border around every element on the HTML page.

* {
    border: 2px solid #000000;
View Preview