August 27, 2007

Eric Meyer: Secrets of the CSS Jedi

  • Padding is for any element (Even images). Use background color on images as a matte color. Transparent PNGs.
  • He is using Keynote. Cool.

CSS Vertical Bar graphs:

  • Apply to table. Table id: #q-graph; div size: em; Display: block; Position table rows absolutely; td Width: 25% (4 quarters) offset left: xx%; height: xx%;
  • Use th for headings (legend) position 100% left, left margin to position to right side (outside) of graph;
  • Tick marks ($ amounts vertically) div position: relative; top: -30em; height: 30em; border-bottom left: 100%; top: -.05 em; $50,000 $40,000
  • CSS Horizontal Bar graphs: See above, change height to width. Left to top.
  • Scope: Associates a th element with a row or column. Scope="col" class="paid"> Cell is read with speaking browser. Search engines will index content easier.
  • Quick outset/inset Border Border-color: #000 #edc #000 #edc (top, right, bottom, left)
  • Do not apply css to unstructured documents.
  • BB Edit (program)
  • Percentages can have decimals.
  • Use em
Reset Style Sheets
  • Browsers use CSS files to interpret CSS as a default. (HTML.css in Firefox). With this in mind, override the defaults. Linky
  • Background color for HTML element is applied to canvas. Background applied to "body" is same thing. This is why they fight sometimes.

No comments: