topical media & game development

talk show tell print

basic-css-10-Examples-css-box-model.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></title>
              <style type='text/css'>
                                  p#paragraph-1 {
                                      padding: 10px;
                                      width: 200px;
                                      border: 1px solid black;
                                      margin: 10px;
                                      background: gray;
                                  }
                                  p#paragraph-2 {
                                      padding: 20px;
                                      width: 180px;
                                      border: 1px solid black;
                                      margin: 10px;
                                      background: lightgrey;
                                  }
              </style>
          </head>
          <body>
                          <p id='paragraph-1'>
                              This paragraph has a 200 pixel width and 10 pixels of padding.
                          </p>
                          <p id='paragraph-2'>
                              This paragraph has a 180-pixel width and 20 pixels of padding, and yet the 
                              backgrounds of both paragraphs are lined up together.
                          </p>
          </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.