Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Frontend 102

Frontend 102

Sebastiaan Deckers

April 15, 2013
Tweet

More Decks by Sebastiaan Deckers

Other Decks in Programming

Transcript

  1. box model clockwise from the top top right bottom left

    img { margin: 10px 5px 0px 20px; }
  2. content box determined by text or fixed size p {

    font-size: 14pt; line-height: 1.5; font-family: "Helvetica Neue"; } img { width: 300px; height: 150px; }
  3. padding box adds a gap between content and border, makes

    it easier to click elements button { padding: 20px; }
  4. Floats: easy to abuse, better to avoid Useful mostly for

    images in a blog post Absolute/fixed positioning: Choose the top, right, bottom, or left distance from a container or viewport. Take it out of the flow