Simply Sombre

Designer's Comments

Look carefully for specific instructions

This is my first web template submitted to createblog. I hope you like it; I thought it was pretty. I think it'd be cute for a small, personal blog-type thing.

Please don't remove the credit, as always.
Brush Credit: Mary's Stamps, Panicked.

Any questions? Leave a comment.
Enjoy!

Layout Code

Copy and paste to Template HTML

Help

<title>Replace This With The Name of Your Site</title>

.title
 {font-family:georgia;
 font-size:50px; color:#ffffff;}

.subtitle
 {font-family:georgia;
 font-size:14px; color:#999999;}

.text
 {font-family:georgia;
 font-size:9px; color:#575757;}

.header
 {font-family:georgia;
 font-size:15px; color:#666666; font-weight:normal;
 border-bottom:2px solid; border-color:#999999;
 padding-left:5px; padding-right:5px;}

a:link, a:visited, a:active
 {color:#999999 !important; text-decoration:none;}
  a:hover
 {color:#000000; text-decoration:none; letter-spacing:1px;}

.creditlink, .creditlink:visited, .creditlink:active
 {font-family:small fonts !important;
 text-transform:uppercase; font-size:8px !important;
 color:#666666 !important; border:none;
 letter-spacing:0px !important; text-decoration:none;}
   .creditlink:hover
    {font-family:small fonts;
    text-transform:uppercase; letter-spacing:0px !important;
    font-size:8px; color:#ffffff !important;
    border:none; text-decoration:none;}

.navilink:link, .navilink, .navilink:visted, .navilink:active
 {font-family:georgia; text-transform:none;
 font-size:11px !important; line-height:20px !important;
 color:#ffffff !important; border:none; text-decoration:none;
 letter-spacing:0px;}
  .navilink:hover
    {font-family:georgia; text-transform:none;
    font-size:11px !important;
    line-height:20px !important; color:#ffffff !important;
    border:none; text-decoration:none;
    letter-spacing:-1px;}

#basebg
{position:absolute; width:600px; height:600px; z-index:1; left:50%; margin-left:-350px; top:0px; overflow:hidden;}

#title
{position:absolute; width:300px; height:200px; z-index:2; left: 50%; margin-left:-120px; top: 176px; text-align:center;}

#subtitle
{position:absolute; width:250px; height:40px; z-index:2; left: 50%; margin-left:-100px; top: 228px; overflow:hidden; text-align:center;}

#content
{position:absolute; width:330px; height:294px; z-index:2; left: 50%; margin-left:-150px; top: 255px; overflow-y:auto; overflow-x:hidden;}

#navigation
{position:absolute; border:none; width:131px; height:200px; z-index:2; left: 50%; margin-left:-235px; padding-left:5px; top: 441px;}

#creditlink
{position:absolute; border:none; width:130px; height:20px;
z-index:2; left: 6px; top: 0px;}
</style>
</head>

<body>

<div id="title">
<span class="title">
Title?
</span>
</div>

<div id="subtitle">
<div align="center">
<span class="subtitle"><i>
Subtitle? Subtitle? Subtitle? Subtitle?
</i></span>
</div>
</div>

<span class="header">
This Is a Header
</span><br><br>

<span class="text">
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br>
<a href="">This is a link.</a> <u>This is underlined.</u> <i>This is italics.</i> <b>This is bold.</b><br> 
<br><br>

<span class="header">
This Is a Header
</span><br><br>

This is the content. This is the content. This is the content. This is the content. This is the content. 
This is the content. This is the content. This is the content. This is the content. This is the content.

This is the content. This is the content. This is the content. This is the content. This is the content.

This is the content. This is the content. This is the content. This is the content. 
</span>
</div>

<div id="creditlink">
<a href="http://www.myspace.com/crotchettheleper" class="creditlink">Crotchet The Leper</a>
</div>

</body>
</html>

Layout Comments

Showing latest 10 of 10 comments

why does this theme look almost exactly like this one: http://www.createblog.com/webs ite-templates/26034-dark-geome trics/ ? :/

By AngelsBaby on Nov 13, 2009 12:14 pm

Simply adorable.

By aimegracen on Jun 26, 2009 12:56 am

Using this for my website-blog! thanks!

By mclwhrnlit on Dec 31, 2008 4:53 pm

This is very nice! I love the design! The small space is really my type, and you just did well with it.

By milkepaper on Oct 22, 2008 9:29 pm

Simply gorgeous.

By TheOn3LeftBehind on Sep 1, 2008 12:54 am

Very nice. I'm using this for my website. =) Thanks for submitting this.

By BittenRose on Jun 25, 2008 3:50 pm

So pretty. I'm using this :D

By IzzyGrace on Jun 2, 2008 11:38 am

I love how elegant it looks, and the colors match perfectly. I hope you make more layouts soon, considering this is your first one and the first is very lovely : ).

By monstrum on Mar 13, 2008 12:41 am

Lovely in its simplicity and elegance.

By Synesthesia on Mar 8, 2008 3:25 pm