News:

Please note these forums are mostly a testing ground for my SMF work and I don't really use them otherwise.

Main Menu

Paste-1285310146:v:use_geshi-1:v:type-html4strict

Started by Guest, Sep 24, 2010, 06:35 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Print
Go Down Pages1
User actions

Guest

Sep 24, 2010, 06:35 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>Curve CSS3 Test</title>
   <style type="text/css">
      * {
         border: 0 none;
         margin: 0;
         padding: 0;
         }
      a:link, a:visited {
         color: #346;
         text-decoration: none;
         }
      a:hover {
         text-decoration: underline;
         }
      html {
         background-color: #e9eef2;
         background-image: -moz-linear-gradient(top, #375a77, #e9eef2 477px, #e9eef2);
         background-image: -webkit-gradient(linear, left top, left bottom, from(#375a77), color-stop(80%, #e9eef2), to(#e9eef2));
         background-attachment: fixed;
         height: 100%;
         }
      body {
         padding: 15px 5% 10px;
         font: 78%/130% "Verdana","Arial","Helvetica",sans-serif;
         color: #444444;
         }
      #outer_edge {
         border: 3px solid white;
         -moz-border-radius: 8px;
         -webkit-border-radius: 8px;
         border-radius: 8px;
         background-image: -moz-linear-gradient(top, #c9d7e8, white 145px, white 92%, #e1e9f3);
         background-image: -webkit-gradient(linear, left top, left bottom, from(#c9d7e8), color-stop(30%, #ffffff), color-stop(92%, #ffffff), to(#e1e9f3));
         /* simulate a second border */
         -moz-box-shadow: 0 0 1px #6a6a6a;
         -webkit-box-shadow: 0 0 1px #6a6a6a;
         box-shadow: 0 0 1px #6a6a6a;
         padding: 5px;
         }
      .forum_title {
         font-family: Geneva,verdana,sans-serif;
         font-size: 1.8em;
         line-height: 42px;
         padding: 0 0 0 10px;
         margin: 0;
         }
      #outer_container {
         margin: 10px 0 10px;
         }
      #upper_section {
         padding: 20px;
         margin-bottom: 1.5em;
         -moz-border-radius: 8px;
         -webkit-border-radius: 8px;
         border-radius: 8px;
         background-image: -moz-linear-gradient(top, #c3cfde, white);
         background-image: -webkit-gradient(linear, left top, left bottom, from(#c3cfde), to(#ffffff));
         min-height: 90px;
         font-size: 0.9em;
         line-height: 1.2em;
         }
      .greeting {
         font-size: 1.2em;
         line-height: 1.7em;
         font-weight: bold;
         }
      #menu {
         font-size: 90%;
         padding: 5px 15px;
         }
      #menu a {
         background-color: white;
         -moz-border-radius: 4px;
         -webkit-border-radius: 4px;
         border-radius: 4px;
         padding: 2px 5px;
         }
      #menu a.active {
         background-color: #fd9604;
         color: white;
         font-weight: bold;
         }
      #menu a:hover {
         background-color: #375a77;
         color: white;
         text-decoration: none;
         }
      #navigation {
         border-top: 1px solid #cccccc;
         font-size: 90%;
         margin: 5px 15px;
         padding: 5px;
         }
      #content {
         font-size: 90%;
         padding: 5px 15px;
         background-color: white;
         -moz-border-radius: 8px;
         -webkit-border-radius: 8px;
         border-radius: 8px;
         height: 300px; /* FAKE IT */
         }
      .catbg {
         padding: 7px 10px;
         font-size: 1.2em;
         font-weight: bold;
         -moz-border-radius: 5px;
         -webkit-border-radius: 5px;
         border-radius: 5px;
         background-image: -moz-linear-gradient(top, #6a7f97, #a6b8cb);
         background-image: -webkit-gradient(linear, left top, left bottom, from(#6a7f97), to(#a6b8cb));
         color: white;
         }
      #copyright {
         font-size: 80%;
         text-align: center;
         padding: 5px;
         }
      #copyright span {
         word-spacing: 8px;
         }
   </style>
</head>
<body>
   <div id="outer_edge">
      <h1 class="forum_title"><a href="#">My Forum Name</a></h1>
      <div id="outer_container">
         <p id="upper_section">
            <span class="greeting">Hello, Fustrate</span>

            <a href="#">Show unread posts since last visit.</a>

            <a href="#">Show new replies to your posts.</a>

            <time>August 04, 2010, 09:02:58 AM</time>
         </p>

         <!-- Menu -->
         <nav id="menu">
            <ul>
               <li class="active" href="#">Home</a>
               <li href="#">Help</a>
               <li href="#">Search</a>
               <li href="#">Admin</a>
               <li href="#">Moderate</a>
               <li href="#">Profile</a>
               <li href="#">My Messages</a>
               <li href="#">Members</a>
               <li href="#">Logout</a>
            </ul>
         </nav>

         <!-- Breadcrumbs -->
         <div id="navigation">
            My Forum Name
         </div>

         <header>
            <span>Author</span>
            <span>Topic: </span>
            <h2 class="catbg">CSS3 Curve-like Demo</h2>
            <p>Read 1460 times</p>
         </header>
         <article id="content">
            <article id="msg2748933">
               <header>
                  <h3>CSS3 Curve-like Demo</h3>
                  <p>on: <time pubdate>August 16, 2010, 11:31:09 PM</time></p>
               </header>
               <div class="author">
                  <h3><a rel="author" href="#">groundup</a></h3>

                  <a rel="author" href="#"><img src="#"></a>
               </div>
               <footer>
                  <span class="bbc_bold">How have you bettered the world today?</span>

Information is power. Empower the people.
               </footer>
            </article>
            <article id="msg2748939">
               <header>
                  <h3>Re: CSS3 Curve-like Demo</h3>
                  <p>Reply #1 on: <time pubdate>August 16, 2010, 11:38:39 PM</time></p>
               </header>
               <div class="author">
                  <h3><a rel="author" href="#">groundup2</a></h3>

                  <a rel="author" href="#"><img src="#"></a>
               </div>
               <footer>
                  <span class="bbc_bold">How have you bettered the world today?</span>

Information is power. Empower the people.
               </footer>
            </article>
         </article>
      </div>
   </div>

   <!-- Copyright, etc. -->
   <footer id="copyright">
      Powered by SMF 2.0 RC4... Not Really | The Copyright Goes Here

      <span>XHTML RSS WAP2</span>
   </footer>
</body>
</html>
Print
Go Up Pages1
User actions