topical media & game development

talk show tell print

professional-web-02-css-rounded-corners.htm / htm



  <?xml version="1.0" encoding="ISO-8859-1"?>
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
          <title>Rounded Corners</title>
          <style type="text/css">
              body {
                  font-family: verdana, sans-serif;
                  font-size: 12px;
              }
  
              .rounded {
                  text-align: center;
                  background: #ffcc66;
                  margin-top: 1em;
              }
          </style>
          <script type="text/JavaScript"
                  src="rounded_corners.js"></script>
          <script type="text/JavaScript">
              window.onload = function() {
                  var settings = {
                      tl: { radius: 10 },
                      tr: { radius: 10 },
                      bl: { radius: 10 },
                      br: { radius: 10 },
                      antiAlias: true,
                      autoPad: true
                  };
                  var cornersObj = new curvyCorners(settings, "rounded");
                  cornersObj.applyCornersToAll();
              }
          </script>
      </head>
      <body>
          <div class="rounded">
              <h3>Lorem Ipsum</h3>
              <p>
                  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
                  incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
                  exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
                  irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                  pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
                  deserunt mollit anim id est laborum.
              </p>
          </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.