[Summary view] [Print] [Text view]

   1  /* $Id: html-elements.css,v 1.1.2.2 2009/02/13 19:42:10 johnalbin Exp $ */
   2  
   3  /****
   4   **** HTML ELEMENT STYLING
   5   ****/
   6  
   7  
   8  /** fonts **/
   9    /*
  10     * Our font size and line height declarations are based on the following ALA
  11     * article:
  12     *   http://www.alistapart.com/articles/howtosizetextincss
  13     *
  14     * All modern browsrs use a 16px default font size. Specifying the font-size
  15     * and line-height in ems (relative to the 16px default font) allows the user
  16     * to resize the font in the browser and produces the most consistent results
  17     * across different browsers.
  18     */
  19    body
  20    {
  21      font-size: 100%; /* Fixes exaggerated text resizing in IE6 and IE7 */
  22    }
  23  
  24    #page
  25    {
  26      /*
  27       * To use a 12px font size on the page, delete the 14px declarations.
  28       * to use a 14px font size on the page, delete the 12px declarations.
  29       */
  30  
  31      /* Use a 12px base font size with a 16px line height */
  32      font-size: 0.75em; /* 16px x .75 = 12px */
  33      line-height: 1.333em; /* 12px x 1.333 = 16px */
  34  
  35      /* Use a 14px base font size with a 18px line height */
  36      font-size: 0.875em; /* 16px x .875 = 14px */
  37      line-height: 1.286em; /* 14px x 1.286 = 18px */
  38    }
  39  
  40    body, caption, th, td, input, textarea, select, option, legend, fieldset
  41    {
  42      /* The following font family declarations are based on the Microsoft core
  43       * web fonts which are common fonts available on most computer systems. The
  44       * Bitstream Vera fonts are commonly available on Linux systems where the MS
  45       * fonts are less common.
  46       *
  47       * A user's web browser will look at the comma-separated list and will
  48       * attempt to use each font in turn until it finds one that is available
  49       * on the user's computer. The final "generic" font (sans-serif or serif)
  50       * hints at what type of font to use if the web browser doesn't find any
  51       * of the fonts in the list.
  52  
  53      font-family: "Times New Roman", Times, Georgia, "Bitstream Vera Serif", serif;
  54      font-family: Times, "Times New Roman", Georgia, "Bitstream Vera Serif", serif;
  55      font-family: Georgia, "Times New Roman", "Bitstream Vera Serif", serif;
  56  
  57      font-family: Verdana, Tahoma, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
  58      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
  59      font-family: Helvetica, Arial, "Bitstream Vera Sans", sans-serif;
  60      font-family: Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
  61  
  62      font-family: "Bitstream Vera Sans Mono", "Courier New", monospace;
  63  
  64       */
  65  
  66      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
  67    }
  68  
  69    pre, code
  70    {
  71      font-size: 1.1em; /* Monospace fonts can be hard to read */
  72      font-family: "Bitstream Vera Sans Mono", "Courier New", monospace;
  73    }
  74  
  75  /** headings **/
  76    h1
  77    {
  78      font-size: 2em;
  79      line-height: 1.3em;
  80      margin-top: 0;
  81      margin-bottom: 0.5em; /* 0.5em is equavalent to 1em in the page's base font.
  82                               Remember, a margin specified in ems is relative to
  83                               the element's font-size, not to the pages' base
  84                               font size. So, for example, if we want a 1em margin
  85                               (relative to the base font), we have to divide that
  86                               length by the element's font-size:
  87                               1em / 2em = 0.5em */
  88    }
  89  
  90    h2
  91    {
  92      font-size: 1.0em;
  93      line-height: 1.3em;
  94      margin-top: 0.667em; /* Equivalent to 1em in the page's base font: 1 / 1.5 = 0.667em */
  95      margin-bottom: 0.667em;
  96    }
  97  
  98    h3
  99    {
 100      font-size: 1.3em;
 101      line-height: 1.3em;
 102      margin-top: 0.769em; /* Equivalent to 1em in the page's base font: 1 / 1.3 = 0.769 */
 103      margin-bottom: 0.769em;
 104    }
 105  
 106    h4, h5, h6
 107    {
 108      font-size: 1.1em;
 109      line-height: 1.3em;
 110      margin-top: 0.909em; /* Equivalent to 1em in the page's base font: 1 / 1.1 = 0.909 */
 111      margin-bottom: 0.909em;
 112    }
 113  
 114  /** block-level elements **/
 115    p, ul, ol, dl, pre, table, fieldset, blockquote
 116    {
 117      margin: 1em 0;
 118    }
 119  
 120  /** lists **/
 121    /* standardize list item indentation */
 122    ul, ol
 123    {
 124      margin-left: 0;
 125      padding-left: 2em;
 126    }
 127  
 128    .block ul, /* Drupal overrides */
 129    .item-list ul
 130    {
 131      margin: 1em 0;
 132      padding: 0 0 0 2em;
 133    }
 134  
 135    ul ul, ul ol,
 136    ol ol, ol ul,
 137    .block ul ul, .block ul ol,
 138    .block ol ol, .block ol ul,
 139    .item-list ul ul, .item-list ul ol,
 140    .item-list ol ol, .item-list ol ul
 141    {
 142      margin: 0;
 143    }
 144  
 145    li
 146    {
 147      margin: 0;
 148      padding: 0;
 149    }
 150  
 151    .item-list ul li /* Drupal override */
 152    {
 153      margin: 0;
 154      padding: 0;
 155      list-style: inherit;
 156    }
 157  
 158    ul.menu li, /* Drupal override */
 159    li.expanded,
 160    li.collapsed,
 161    li.leaf
 162    {
 163      margin: 0;
 164      padding: 0;
 165    }
 166  
 167    ul          { list-style-type: disc; }
 168    ul ul       { list-style-type: circle; }
 169    ul ul ul    { list-style-type: square; }
 170    ul ul ul ul { list-style-type: circle; }
 171    ol          { list-style-type: decimal; }
 172    ol ol       { list-style-type: lower-alpha; }
 173    ol ol ol    { list-style-type: decimal; }
 174  
 175    dt
 176    {
 177      margin: 0;
 178      padding: 0;
 179    }
 180  
 181    dd
 182    {
 183      margin: 0 0 0 2em;
 184      padding: 0;
 185    }
 186  
 187  /** links **/
 188    /* The order of link states are based on Eric Meyer's article:
 189     * http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states
 190     */
 191    a:link
 192    {
 193    }
 194  
 195    a:visited
 196    {
 197    }
 198  
 199    a:hover,
 200    a:focus
 201    {
 202    }
 203  
 204    a:active
 205    {
 206    }
 207  
 208  /** tables **/
 209    /* Override Drupal default CSS */
 210    table
 211    {
 212      border-collapse: collapse;
 213      /* width: 100%; */ /* Prevent cramped-looking tables */
 214    }
 215  
 216    th,
 217    thead th,
 218    tbody th
 219    {
 220      text-align: left;
 221      padding-right: 0;
 222      border-bottom: none;
 223    }
 224  
 225    tbody
 226    {
 227      border-top: none;
 228    }
 229  
 230  /** abbreviations **/
 231    abbr
 232    {
 233      border-bottom: 1px dotted #666;
 234      cursor: help;
 235      white-space: nowrap;
 236    }
 237  
 238    /* Date-based "abbreviations" show computer-friendly timestamps which are not
 239       human-friendly. */
 240    abbr.created
 241    {
 242      border: none;
 243      cursor: auto;
 244      white-space: normal;
 245    }
 246  
 247  /** images **/
 248    img
 249    {
 250      border: 0;
 251    }
 252  
 253  /** horizontal rules **/
 254    hr
 255    {
 256      height: 1px;
 257      border: 1px solid #666;
 258    }
 259  
 260  /** forms **/
 261    form
 262    {
 263      margin: 0;
 264      padding: 0;
 265    }
 266  
 267    fieldset
 268    {
 269      margin: 1em 0;
 270      padding: 0.5em;
 271    }
 272  
 273  .view-testimonial-view  .views-field-body  .field-content p:first-letter
 274    {
 275          background: url('/drupal-test/sites/all/images/openquote.gif') no-repeat left top !important;
 276       padding:5px 2px 10px 25px!important;
 277     }
 278  
 279  .view-testimonial-view  .views-field-body  .field-content p:after
 280    { 
 281      content: url('/drupal-test/sites/all/images/closequote.gif');
 282    }
 283  
 284  .views-field-field-testim-author-value
 285    {
 286      padding-bottom: 1em;
 287    }