topical media & game development

talk show tell print

basic-css-04-Examples-em-measurement.htm / htm



  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  <html>
      <head>
          <title> em measurement </title>
          <style type='text/css' media='all'>
                  body {
                          border: 1em solid black;
                          margin: 0;
                          padding: 10px;        
                  }       
              div {
                  font-size: 24px;
                  height: 3em;
                  border: 1em solid black;
              }
          </style>
      </head>
      <body>
              The body's border is 1em thick. The body doesn't have a font 
              size defined, so the em measurement here goes by the browser's 
              default font size, which may vary from browser to browser. 
          <div>
              This font is 24 pixels tall and this div is 3 ems tall, 
              which results in a div 72 pixels tall (3 * 24 = 72). Its 
              border is 1em thick, or 24 pixels thick.
          </div>
      </body>
  </html>


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.