daily pastebin goal
35%
SHARE
TWEET

Testgedöns für Seitenlayout mit CSS

RandomGuy32 Feb 14th, 2014 84 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>
  5.         Ersatz für Frames mit CSS, was angeblich besser, aber trotzdem ziemlich unnötig ist, aber egal
  6.         </title>
  7. <!-- Metagedöns -->
  8. <meta name="author" content="Eiffel" />
  9. <!-- Stylesheet -->
  10. <style type="text/css">
  11.         body {
  12.                 background-color: #ffffff;
  13.                 }
  14.         header {
  15.                 width: 500px;
  16.                 height: 100px;
  17.                 font-family: arial, sans-serif;
  18.                 font-size: 5em;
  19.                 font-weight: bold;
  20.                 font-style: italic;
  21.                 font-variant: small-caps;       /* Weil Kapitälchen einfach geil aussehen */
  22.                 text-align: center;
  23.                 vertical-align: middle;
  24.                 color: #00198f;
  25.                 background-color: #f2f2f2;
  26.                 border-color: #000000;
  27.                 border-width: 2px;
  28.                 border-style: solid;
  29.                 border-radius: 5px;
  30.                 /* Hier beginnt der Spaß */
  31.                 position: absolute;
  32.                 left: 50%;              /* Y U NO IN THE CENTRE OF DOCUMENT? */
  33.                 /* Es muss doch möglich sein, den Referenzpunkt für die Positionsangaben zu verschieben */
  34.                 }
  35.         #werbung {
  36.                 position: fixed;
  37.                 bottom: 20px;
  38.                 right: 40px;
  39.                 width: 220px;
  40.                 height: 150px;
  41.                 text-align: center;
  42.                 vertical-align: middle;
  43.                 border-width: 2px;
  44.                 border-style: groove;
  45.                 border-color: #0022ff;
  46.                 border-radius: 2px;
  47.                 background-color: #ff00ff;
  48.                 }
  49.         #congaditto {
  50.                 width: 100px;
  51.                 }
  52.         a.ad:link, a.ad:visited, a.ad:active, a.ad:hover {
  53.                 color: #0000ff;
  54.                 font-size: 1em;
  55.                 text-decoration: underline;
  56.                 font-family: "Times New Roman", serif;
  57.                 }
  58. </style>
  59. </head>
  60. <body>
  61. <!-- We're gonna need a whole lot of Lorem ipsum for this. -->
  62. <header>Lorem Ipsum</header>
  63. <div id="werbung">
  64.         <img id="congaditto" align="center" src="http://www.matmartinez.net/nsfw/ditto.gif" alt="GIRLS GIRLS GIRLS" title="HAPPY HAPPY SEXY TIME" />
  65.         <br />
  66.         <a class="ad" href="http://bit.ly/1lPNHjG" target="_blank">Searching for that special Ditto in your life?</a>
  67. </div>
  68. </body>
  69. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top