Ebony and Ivory

29 May 2004 at 7:18 pm

Hello! This is what this design will look like. The image comes from Stock Exchange, and the background comes from Squidfingers. There is a cool blockquote and all that jazz with this one :) The background colour doesn't show up when you view it in Mozilla, for a reason yet unknown to me, but it looks fine in IE and Opera. You will need to change the USERNAME bits to your username, and the %%PREV%% and %%NEXT%% to lowercase.

To get the code for this entry, simply copy and paste the code below into your change my template area.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
 <head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>ebony and ivory</title>
  <style type="text/css">
   body{
    background-color:#202020;
    background-image:url(http://www.sitefights.com/community/graphics/pinkfreak2//blackbg.gif);
    scrollbar-arrow-color:#676767;
    scrollbar-face-color:#202020;
    scrollbar-highlight-color:#202020;
    scrollbar-shadow-color:#202020;
    scrollbar-3dlight-color:#676767;
    scrollbar-darkshadow-color:#676767;
    scrollbar-track-color:#202020;}
   .ebony{
    position:absolute;
    top:0px;
    left:0px;
    width:571px;
    height:347px;
    padding:350px 10px 10px 10px;
    font:12px 'Trebuchet MS';
    line-height:22px;
    text-align:justify;
    color:#202020;
    background-image:url(http://www.sitefights.com/community/graphics/pinkfreak2//ebony1.jpg);
    background-repeat:no-repeat;
    background-color:#FFFFFF;
    border-right:4px solid #202020;
    box-sizing:border-box;
    -moz-box-sizing:border-box;}
   a:link{
    color:#676767;
    text-decoration:none;}
   a:visited{
    color:#676767;
    text-decoration:none;}
   a:hover{
    color:#3F3F3F;
    text-decoration:none;
    border-bottom:1px dashed #1D1D1D;}
   a:active{
    color:#3F3F3F;
    text-decoration:none;
    border-bottom:1px dashed #1D1D1D;}
   h1{
    margin:0px;
    font-size:20px;
    line-height:26px;
    text-align:right;
    font-weight:bold;
    border-bottom:1px dashed #1D1D1D;}
   h2{
    margin:0px;
    font-size:14px;
    line-height:20px;
    font-weight:bold;
    font-style:italic;
    text-align:left;}
   h3{
    margin:0px;
    font-size:16px;
    line-height:22px;
    font-weight:bold;
    text-align:right;
    border-bottom:1px dashed #1D1D1D;}
   h4{
    margin:0px;
    font-size:12px;
    line-height:20px;
    font-weight:normal;
    font-style:italic;
    text-align:left;}
   h5{
    margin:0px;
    font-size:16px;
    line-height:22px;
    font-weight:bold;
    text-align:center;
    border-bottom:1px dashed #1D1D1D;}
   h6{
    margin:0px;
    font-size:12px;
    line-height:20px;
    font-weight:normal;
    font-style:italic;
    text-align:center;}
   b,i,u,strong,em{
    text-transform:uppercase;
    font-size:10px;}
   blockquote{
    padding:10px;
    color:#676767;
    border:1px dashed #676767;}
   input,textarea{
    font:12px 'Trebuchet MS';
    color:#676767;
    border:1px dashed #676767;}
   hr{
    color:#FFFFFF;
    border-bottom:1px dashed #676767;}
  </style>
 </head>
 <body>
  <div class="ebony">
   <h1>%%short_description%%</h1>
   <h2>%%date%% at %%time%%</h2>
    <br />
   %%entry%%
    <br /><br />
   <h3><a href="%%PREV%%">last</a> & <a href="%%NEXT%%">next</a></h3>
   <h4><a href="index.html">newest</a> <a href="older.html">archives</a> <a href="http://members.diaryland.com/edit/profile.phtml?user=USERNAME">profile</a> <a href="http://members.diaryland.com/edit/notes.phtml?user=USERNAME">notes</a> <a href="http://www.sxc.hu/browse.phtml?f=profile&l=KillR-B" target="_blank">image</a> <a href="http://www.squidfingers.com" target="_blank">pattern</a> <a href="http://pink-design.diaryland.com" target="_blank">design</a> <a href="http://www.diaryland.com" target="_blank">host</a></h4>
  </div>
 </body>
</html>

To make your older entries page match, paste this code into your change your archive page area.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
 <head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>ebony and ivory</title>
  <style type="text/css">
   body{
    background-color:#202020;
    background-image:url(http://www.sitefights.com/community/graphics/pinkfreak2//blackbg.gif);
    scrollbar-arrow-color:#676767;
    scrollbar-face-color:#202020;
    scrollbar-highlight-color:#202020;
    scrollbar-shadow-color:#202020;
    scrollbar-3dlight-color:#676767;
    scrollbar-darkshadow-color:#676767;
    scrollbar-track-color:#202020;}
   .ebony{
    position:absolute;
    top:0px;
    left:0px;
    width:571px;
    height:347px;
    padding:350px 10px 10px 10px;
    font:12px 'Trebuchet MS';
    line-height:22px;
    text-align:justify;
    color:#202020;
    background-image:url(http://www.sitefights.com/community/graphics/pinkfreak2//ebony1.jpg);
    background-repeat:no-repeat;
    background-color:#FFFFFF;
    border-right:4px solid #202020;
    box-sizing:border-box;
    -moz-box-sizing:border-box;}
   a:link{
    color:#676767;
    text-decoration:none;}
   a:visited{
    color:#676767;
    text-decoration:none;}
   a:hover{
    color:#3F3F3F;
    text-decoration:none;
    border-bottom:1px dashed #1D1D1D;}
   a:active{
    color:#3F3F3F;
    text-decoration:none;
    border-bottom:1px dashed #1D1D1D;}
   h1{
    margin:0px;
    font-size:20px;
    line-height:26px;
    text-align:right;
    font-weight:bold;
    border-bottom:1px dashed #1D1D1D;}
   h2{
    margin:0px;
    font-size:14px;
    line-height:20px;
    font-weight:bold;
    font-style:italic;
    text-align:left;}
   h3{
    margin:0px;
    font-size:16px;
    line-height:22px;
    font-weight:bold;
    text-align:right;
    border-bottom:1px dashed #1D1D1D;}
   h4{
    margin:0px;
    font-size:12px;
    line-height:20px;
    font-weight:normal;
    font-style:italic;
    text-align:left;}
   h5{
    margin:0px;
    font-size:16px;
    line-height:22px;
    font-weight:bold;
    text-align:center;
    border-bottom:1px dashed #1D1D1D;}
   h6{
    margin:0px;
    font-size:12px;
    line-height:20px;
    font-weight:normal;
    font-style:italic;
    text-align:center;}
   b,i,u,strong,em{
    text-transform:uppercase;
    font-size:10px;}
   blockquote{
    padding:10px;
    color:#676767;
    border:1px dashed #676767;}
   input,textarea{
    font:12px 'Trebuchet MS';
    color:#676767;
    border:1px dashed #676767;}
   hr{
    color:#FFFFFF;
    border-bottom:1px dashed #676767;}
  </style>
 </head>
 <body>
  <div class="ebony">
   <h1>Archives</h1>
   <h2>�</h2>
    <br />
   %%older_entries%%
    <br /><br />
   <h3>�</h3>
   <h4><a href="index.html">newest</a> <a href="older.html">archives</a> <a href="http://members.diaryland.com/edit/profile.phtml?user=USERNAME">profile</a> <a href="http://members.diaryland.com/edit/notes.phtml?user=USERNAME">notes</a> <a href="http://www.sxc.hu/browse.phtml?f=profile&l=KillR-B" target="_blank">image</a> <a href="http://www.squidfingers.com" target="_blank">pattern</a> <a href="http://pink-design.diaryland.com" target="_blank">design</a> <a href="http://www.diaryland.com" target="_blank">host</a></h4>
  </div>
 </body>
</html>

And paste this code into your change how each page on your older.html page looks area.

If you need any help or anything doesn't work for you, just email me and I'll do my best to help out.

Ebony and Ivory

29 May 2004 at 7:18 pm

last & next

updates templates about links email notes image pattern design host