lhinneill ◾ ◾ Headers

I've had these headers sitting around on my computer for weeks now, and I keep forgetting to post them. I had planned to make individual layouts for each, but just haven't had time. So, here they are. I'm also uploading a simple layout. It'll work with the 800x350 headers, but you can tweak it if you know how. If not, just ask and I'll help you out.

Please don't hotlink any of the images. Upload them to your own servers/free hosting sites.

For the layout:

Background image: http://img362.imageshack.us/img362/4539/peoplemachines003bd7.jpg
Save to your own server or a hosting service and paste the link in the body/background image url.

Choose your header and paste the URL code in the .headerimage area, where it says HEADER IMAGE LINK.

The code:

/* Cleaned CSS: */

body	{
		background-image: url(BACKGROUND IMAGE LINK);
		background-color: #ffffff;
		text-align: center;
		color: #000000;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		margin: 20px 0 20px 0;
		}

a, a:link, a:visited {
		color: #666666;
		text-decoration: none;
		}

a:hover {
		color: #000000;
		text-decoration: underline;
		}

p, td, blockquote {
	    	font-size: 11px;
		}

code, kbd, pre, tt {
	    	font-family: monospace;
		}

/*---------------------------------------------------------------------
   General page alignment and width
------------------------------------------------------------------------*/

#content
	{
		width: 780px;
		margin-left: auto; margin-right: auto;
		background-color: #ffffff;
		padding: 15px;
	}

#maincontent {
		margin-top: 15px;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		background-color: transparent!important;
		color: #000000;
		margin-right: 180px;
		text-align: left;
		}

#sidebar {
		padding-top: 15px;
		margin-top: 5px;
		background-color: #ffffff;
	  	font-size: 11px;
		font-family: "Verdana", sans-serif;
	  	color: #000000;
		width: 160px;
		float: right;
		text-align: right;
		}

/*-----------------------------------------------------------------------------
   Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/

#header {
		width: 100%;
		padding: 0px 0px 5px 0px;
		margin: 0px;
		text-align: center;
		font-family: "Verdana", sans-serif;
		font-size: 10px;
		font-weight: lighter;
		text-transform: uppercase;
		letter-spacing: 2px;
		background-color: transparent!important;
		color: #000000;
		}

.headerimage {
		position: relative;
		width: 800px;
		height: 350px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0px;
		background-image: url("HEADER IMAGE LINK");
		background-repeat: no-repeat;
			border-top: 5px #ffffff solid;
			border-bottom: 5px #ffffff solid;
			border-left: 5px #ffffff solid;
			border-right: 5px #ffffff solid;
		}

/*look  and color of links (also partly for footer)*/
	div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
		color: #666666;
	}

div#header a:hover, div#footer a:hover {
		color: #000000;
		text-decoration: none;
	}

/*title and subtitle*/
	.title, .subtitle	{
		display: none;
		}

/*-----------------------------------------------------------------------------
   Header - top navigation
--------------------------------------------------------------------------------*/

/* header -- links to views; title of journal; subtitle of journal */

ul.navheader	{
		padding: 0px;
		margin: 0px;
		}

ul.navheader li  {
		display: inline;
		padding: 5px;
		margin: 0 1px;
		}

/*-----------------------------------------------------------------------------
   Entry stuff
------------------------------------------------------------------------*/

.subcontent {
	}

.entry	{
		margin: 0px 10px 10px 30px;
		padding: 10px;
		background-color: transparent!important;
		color: #000000;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		text-align: justify;
		border-width: 1px;
		border-color: #000000;
		border-style: solid;
		}

.userpic {
		position: relative;
		float: left;
		background-color: #ffffff!important;
		padding: 5px;
		margin: 10px;
		z-index: 15;
		border-width: 1px;
		border-color: #000000;
		border-style: solid;
		}

.date {
		padding-top: 2px;
		padding-bottom: 2px;
		text-align: right;
			color:#000000
		top: 5px;
		font-family: "Verdana", sans-serif;
		font-size: 10px;
		text-transform: uppercase;
		}

.subject {
		font-weight: none;
		padding-bottom: 1px;
		padding-top: 1px;
	      	  padding-left: 10px;
		color: #000000;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		}

.subject a, .subject a:link, .subject a:visited {
		color: #666666;
		}

.subject a:hover {
		color: #000000;
		}

.datesubject {
		background-color: transparent!important;
		padding: 5px;
		}

.entry ul li
		{
		padding-left: 5px;
		margin-left: 15px;
		}

.entry ol li
		{
		padding-left: 5px;
		margin-left: 15px;
		}

/*---------------------------------------------------------------------
  Entry Stuff - Current Mood, Music and Location
------------------------------------------------------------------------*/

.currents, .currentmood, .currentmusic {
		font-family: "Verdana", sans-serif;
		font-weight: lighter;
		font-size: 11px;
		}

/*---------------------------------------------------------------------
  Entry Stuff - Comments
------------------------------------------------------------------------*/

.comments {
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		font-weight: lighter;
		text-align: right;
		background-color: #ffffff;
		border-left: 1px #000000 solid;
		border-right: 1px #000000 solid;
		border-bottom: 1px #000000 solid;
		padding: 0px 5px 0px 5px;
		position: relative;
		top: 15px;
		}

div.comments a, div.comments a:link, div.comments a:visited{
		color: #000000;
	}

div.comments a:hover {
		color: #666666;
		text-decoration: none;
	}

/*---------------------------------------------------------------------
  Entry Stuff - Separator
------------------------------------------------------------------------*/

.separator{
		/* for formatting separators between entries */
		height: 15px;
	}

/*------------------------------------------------------------
  Special friends page customization
-------------------------------------------------------------------------------*/

.userpicfriends {
		position: relative;
		float: left;
		padding: 5px;
		margin: 10px;
		text-align: center;
		border-style: solid;
		border-width: 1px;
		border-color: #000000;
                background-color: #ffffff!important;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		z-index: 15;
		}

/*------------------------------------------------------------
  Sidebar
-------------------------------------------------------------------------------*/

.defaultuserpic {
		text-align: center;
		}

.sbarheader {
		padding: 0px 5px 0px 5px;
		}

.sbarbody {
		padding: 0px 5px 0px 5px;
		}

.sbarbody2 {
		padding: 0 15px 0 15px;
	}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
                 color: #666666;
         }

div#sidebar a:hover {
                 color: #000000;
                 text-decoration: none;
         }

/*------------------------------------------------------------
  Sidebar - Calendar
-------------------------------------------------------------------------------*/

table.calendar {
		margin-right: auto;
		margin-left: auto;
		}

.sbarcalendar {
		border-color: #000000;
		border-width: 1px;
		border-style: solid;
		text-align: center;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		}

.sbarcalendarposts {
		border-color:  #666666;
		border-width: 1px;
		border-style: solid;
		background-color: #ffffff;
		text-align: center;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		}

/*------------------------------------------------------------
  Sidebar - link box contents and sidebar box titles
-------------------------------------------------------------------------------*/

ul.sbarlist
	{
		padding-left: 0px;
		margin-left: 0px;
		list-style: none;
	}

li.sbaritem
	{
		padding-left: 15px;
		list-style: none;
	}

li.sbartitle
	{
		text-align: left;
                padding-left: 5px;
		list-style: none;
		border-bottom: 1px #000000 solid;
		margin-bottom: 6px;
		margin-top: 6px;
	}

/*----------------------------------------------------
  footer
----------------------------------------------------------------*/

#footer {
		width: 100%;
		text-align: center;
		font-family: "Verdana", sans-serif;
		font-size: 10px;
		font-weight: lighter;
		text-transform: uppercase;
		letter-spacing: 1px;
		color: #000000;
		z-index: 100;
		clear: both;
		}

ul.navfooter{
		padding: 0px;
		margin: 0px;
		}

ul.navfooter li  {
		display: inline;
		padding: 5px;
		margin: 0 1px;
	        border: 1px #000000 solid;
		}

.clearfoot {
		clear: both;
		}

/*----------------------------------------------------
 Archive Pages
----------------------------------------------------------------*/

ul.year {
		text-align: center;
		padding-bottom: 40px;
		}

ul.year li {
		display: inline;
		}

table.yeartable {
		margin-left: auto;
		margin-right: auto;
		}

table.yeartable td.yeardate, table.yeartable td.yearday {
		border-width: 1px;
		border-style: solid;
		border-color: #000000;
		}

table.yeartable td.yearday {
		background-color: #ffffff;
		text-align: center;
		}

td.yearmonth {
		border-style: none;
		}

/*----------------------------------------------------
 Comments pages
----------------------------------------------------------------*/

.datesubjectcomment {
			background-color: #ffffff;
			border-bottom:1px #000000 solid;
			padding: 5px;
			margin-top: 20px;
			}

.userpiccomment {
		position: relative;
		border-width: 5px;
		border-style: solid;
		border-color: #000000;
		background-color: #ffffff;
		top: -30px;
		left: 0px;
		padding: 5px;
		margin: 10px 10px -20px 10px;
		z-index: 15;
		float: left;
		border-width: 1px;
		border-color: #000000;
		border-style: solid;
		}

.box {
		border-style: solid;
		border-width: 1px 0px 0px 0px;
		border-color: #000000;
		padding: 10px;
		clear: left;
		}

form div.box {
		text-align:center;
	}

div#content input,
	div#content textarea,
	div#content select {
		color: #000000;
		border:#000000 solid 1px;
		background-color:#ffffff;
		}

textarea.textbox  {
          	width: 100% !important;
   		}

.reply	{
		position: relative;
		margin: 20px 30px 10px 30px;
		padding: 25px 10px 10px 10px;
		text-align: left;
		font-family: "Verdana", sans-serif;
		font-size: 11px;
		line-height: 125%;
		background-color: #ffffff;
		color: #000000;
		}

.replytosubject {
		font-weight: none;
		}

.commentreply {
		position: relative;
		margin: 10px;
                text-align: justify;
		font-size: 11px;
		font-family: "Verdana", sans-serif;
		color: #000000;
		}

.commentbox {

border-color: #000000;
		border-width: 1px;
		border-style: solid;
		padding: 10px;
		margin: 10px;
		background-color: #ffffff;
		}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
		color: #666666;
		}

.datesubjectcomment a:hover {
		color: #000000;
		}

.commentboxpartial {
		border-color: #000000;
		border-width: 1px;
		border-style: solid;
		padding: 10px;
		margin: 10px;
		background-color: #ffffff;
		}

.commentinfo {
		background-color: #ffffff;
		margin-top: 10px;
		width: 100%;
		}

.skiplinks {
		text-align: center;
		}

/*--------------------------------------------
Misc
-----------------------------------------*/

Putting the CSS on your journal
1) Go to Manage Accounts -> Customize Journal -> Basics and choose the S2 style system.

2) Go to Look and Feel, select Flexibles Squares and hit Save Changes.

3) Go to Custom Options -> Custom CSS

4) Make sure you disable Use layout's stylesheet(s) and Use external stylesheets

5) Now copy & paste the CSS code into the box

6) Hit Save Changes.

Flat ◾ Top-Level Comments Only

Date/Time: 2006-12-27 19:48 (UTC)Posted by:

larian.livejournal.com

Purty! Took Cam and the John/Aeryn.

Date/Time: 2006-12-27 20:48 (UTC)Posted by:

lhinneill.livejournal.com

Glad you like them. ^_^

Date/Time: 2006-12-27 23:09 (UTC)Posted by:

glowing-sunset.livejournal.com

took the cam and the john/aeryn one... meming this to fiddle with the layout later. Will credit!

Date/Time: 2006-12-28 16:26 (UTC)Posted by:

Cool, thanks! I'm glad you like 'em. =)

Date/Time: 2006-12-27 23:33 (UTC)Posted by:

emosweet.livejournal.com

these are seriously amazing, i love each and every one of them.
the John and Aeryn one is so cute, i just got hooked into farscape lately, the Shep one is very pretty and very deep! also the shepweir one, so lovely :D
i would totally take the Ronon one home, but then i can't let go of my S/J ;)

Date/Time: 2006-12-28 16:28 (UTC)Posted by:

John/Aeryn is such an awesome ship. If it wasn't for Sam/Jack, they'd be my favorte couple. ^_^

Glad you like the headers. *g*

Date/Time: 2006-12-29 04:15 (UTC)Posted by:

shansgrl.livejournal.com

You are completely awesome! I snagged the Cam one and thank you for sharing the coding as well. I can't do the coding thing at all.

Thank you so very much for sharing!!!

Date/Time: 2006-12-29 05:24 (UTC)Posted by:

Aw, thank YOU. I'm glad you like them. Love your icon too. ^_^

so-out-of-ideas.livejournal.com

Jonas! and I love the Sparky one. But...someone is missing...

Date/Time: 2006-12-29 05:29 (UTC)Posted by:

*carky* Sorry, Dar. You'll note Sam/Jack and Jack are missing too.

Date/Time: 2006-12-29 05:30 (UTC)Posted by:

Ah, yes. *taps foot* :P

Date/Time: 2006-12-29 05:33 (UTC)Posted by:

Date/Time: 2007-01-01 09:32 (UTC)Posted by:

aotearoagal.livejournal.com

Hi there, sorry to comment with something unrelated, but as you are no longer watching the

sga_icontest community, you may have missed that you recently scored first place in the icon entry of 2006.

Your banner, if you want it, can be found here (http://community.livejournal.com/sga_icontest/43960.html)

Date/Time: 2007-01-01 15:24 (UTC)Posted by:

Wow, thanks for letting me know!

not all who wander are lost

◾ Headers

Headers

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

Profile

October 2011

Page Summary

Most Popular Tags

Expand Cut Tags

Links

Style Credit