Coding IQ icon

Download
& Install

Welcome!

  1. Atom Editor: http://atom.io
  2. Chrome Browser: https://www.google.ca/chrome

Workshop #5

Building a menu

CSS Float

To get block level elements to line up side by side, the stacking flow has to be broken first.

Use the float property with a value of left or right to align the element to either side. Any element after the floated element will move up beside it. Let's try it out in the example below.

placeholder image

Paragraph tag - Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea id quasi iusto, ex cumque omnis iste eveniet mollitia corporis enim.

Position: fixed

When positioning an element as fixed, it will always be positioned to the viewport (browser window) and stay fixed, even on page scroll.

In the example below, try adding a top value (or any other directional offset property: right, bottom, left).