Styles - how to...

  • Bold text
    • font-weight: bold;
  • un-bold text - <h3 style="font-weight: normal;>

    This is an h3

    </h3>
    • font-weight: normal;
  • Italics
    • font-style: italic;
  • Delete unwanted margins of H tags <h3 style="display: inline;>

    This is an h3

    </h3>
    • display: inline;
  • Declare font
    • font-family: Georgia, 'serif'
  • text color
    • color: red
  • Background color
    • background-color: red
  • color with alpha
    • background-color:rgba(255,0,0,.50)
  • Change leading (this one is tricky) Inside a tag use line-height, outside a tag use margin

    • This are two lines within a paragraph
      line-height: -10px

    • These are two paragraphs

      margin-top: -30px

  • Left or right align images
    • float: left;
  • Add Padding
    • padding: 10px;
  • Center align layout tags
    • margin:auto;
      *not to be confused with text-align: center;
  • Expand outer divs containing floating inner divs:
    • overflow: auto; (or hidden)
  • Position AP divs inside the containing div instead of the whole page
    • Apply to the container element
      position: relative;
  • Add padding without increasing the size of the container
    • box-sizing:border-box;