lj layout and psd1/psd2
Okay so, I don't know what I'm really doing, it's been so long since I last used html and css so don't hate me if this layout doesn't work for anyone! It should though. I've tried it out in my journal obviously. So have fun with it, just don't claim it as your own. Leave the credits section in the css, please!
/*--------------------------------------------------- Layout by - likeacliche likeacliche.livejournal.com Layout Title - Sweet Green DO NOT DELETE THIS SECTION And thanks to http://irinafan.livejournal.com/ for the wonderful basic CSS -----------------------------------------------------*/ body { background-color: #c8c8c8; text-align: center; color: #000000; font-family: "Trebuchet MS", sans-serif; font-size: 9px; margin: 20px 0 20px 0; } a, a:link, a:visited { color: #565656; text-decoration: none; } a:hover { color: #ababab; text-decoration: none; } p, td, blockquote { font-family:"trebuchet ms"; background-color:#ffffff; padding:5px; border:0px dashed; color:#5fba53; } /*--------------------------------------------------------------------- General page alignment and width ------------------------------------------------------------------------*/ #content { width: 50%; margin-left: auto; margin-right: auto; background-color: #ffffff; border-width: 0px; border-style: solid; border-color: #999999; padding: 15px; } #maincontent { margin-top: 15px; font-family: "Arial", sans-serif; font-size: 9px; background-color: #ffffff; color: #000000; border-style: solid; border-color: #999999; border-width: 0px; text-align: center; } #sidebar { padding-top: 15px; margin-top: 15px; background-color: #c2cde0; border-color: #999999; border-width: 1px; border-style: solid; font-size: 11px; font-family: "Verdana", sans-serif; color: #000000; width: 160px; float: right; text-align: left; display: none; } /*----------------------------------------------------------------------------- Header --------------------------------------------------------------------------------*/ #header { width: 100%; padding: 10px 0px 20px 0px; margin: 0px; text-align: center; font-family: "Arial", sans-serif; font-size: 9px; font-weight: bold; letter-spacing: 2px; border-style: solid; border-color: #999999; border-width: 0px; background-color: #ffffff; color: #ababab; } .headerimage { /* for formatting header image */ position: relative; margin-left: auto; margin-right: auto; margin-bottom: 0px; width: 533px; height: 200px; background-image: url('http://i31.tinypic.com/15hcgi.png'); background-repeat: no-repeat; } /*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: #5fba53; } div#header a:hover, div#footer a:hover { color: #5fba53; text-decoration: none; } /*title and subtitle*/ .title { font-family: "Verdana", sans-serif; font-size: 11px; font-weight: normal; line-height: 200%; top: 10px; } .subtitle{ font-family: "Verdana", sans-serif; font-size: 11px; font-weight: normal; top: 10px; } /*----------------------------------------------------------------------------- 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: 0 3px 0 3px; } /*----------------------------------------------------------------------------- Entry stuff ------------------------------------------------------------------------*/ .subcontent { } .entry { margin: 0px 10px 10px 30px; padding: 10px; background-color: #ffffff; color: #ababab; font-family: "Arial", sans-serif; font-size: 9px; text-align: left; border-width: 0px; border-color: #919bad; border-style: solid; } .userpic { position: relative; float: left; background-color: #ffffff; padding: 5px; margin: 10px; z-index: 15; border-width: 0px; border-color: #919bad; border-style: solid; } .date { line-height: 200%; top: 2px; color: #757575; font-family: "Arial", sans-serif; font-size: 9px; } .subject { font-weight: bold; padding: 10px; color: #5fba53; font-family: "Arial", sans-serif; font-size: 12px; } .subject a, .subject a:link, .subject a:visited { color: #5fba53; } .subject a:hover { color: #ababab; } .datesubject { background-color: #ffffff; 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: "Arial", sans-serif; font-size: 9px; } /*--------------------------------------------------------------------- Entry Stuff - Comments ------------------------------------------------------------------------*/ .comments { font-family: "Arial", sans-serif; font-size: 9px; text-align: right; background-color: #ffffff; padding: 0px 5px 0px 5px; position: relative; top: 15px; } div.comments a, div.comments a:link, div.comments a:visited{ color: #5fba53; } div.comments a:hover { color: #757575; text-decoration: none; } /*--------------------------------------------------------------------- Entry Stuff - Separator ------------------------------------------------------------------------*/ .separator{ /* for formatting separators between entries */ height: 35px; } /*------------------------------------------------------------ Special friends page customization -------------------------------------------------------------------------------*/ .userpicfriends { position: relative; float: left; padding: 5px; margin: 10px; text-align: center; border-style: solid; border-width: 0px; border-color: #919bad; font-family: "Arial", sans-serif; font-size: 9px; 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: #5674b9; } div#sidebar a:hover { color: #7aa1f8; 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: #000000; border-width: 1px; border-style: solid; background-color: #d4dce8; 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 { padding-left: 15px; list-style: none; border-style: solid; border-width: 1px; border-color: #999999; background-color: #919bad; margin-bottom: 10px; margin-top: 10px; } /*---------------------------------------------------- Footer ----------------------------------------------------------------*/ #footer { width: 100%; text-align: center; font-family: "Arial", sans-serif; font-size: 9px; font-weight: bold; letter-spacing: 1px; background-color: #ffffff; color: #5fba53; border-color: #999999; border-width:0px; border-style: solid; z-index: 100; clear: both; } ul.navfooter{ padding: 0px; margin: 0px; } ul.navfooter li { display: inline; margin: 0 5px 0 5px; } .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: 0px; border-style: solid; border-color: #999999; } table.yeartable td.yearday { background-color: #ffffff; text-align: center; } td.yearmonth { border-style: none; } /*---------------------------------------------------- Comments pages ----------------------------------------------------------------*/ .datesubjectcomment { background-color: #ffffff; padding: 5px; margin-top: 20px; } .userpiccomment { position: relative; border-width: 5px; border-style: solid; border-color: #ffffff; background-color: #ffffff; top: -30px; left: 0px; padding: 5px; margin: 10px 10px -20px 10px; z-index: 15; float: left; border-width: 0px; border-color: #919bad; border-style: solid; } .box { border-style: solid; border-width: 1px 0px 0px 0px; border-color: #999999; padding: 10px; clear: left; } input, textarea { background-color: #d4dce8; color: #000000; } textarea.textbox { width: 100% !important; } .reply { position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: left; font-family: "Arial", sans-serif; font-size: 9px; line-height: 125%; background-color: #ffffff; color: #ababab; } .replytosubject { font-weight: bold; } .commentreply { position: relative; margin: 10px; font-size: 11px; font-family: "Arial", sans-serif; color: #ababab; } .commentbox { border-color: #5fba53; border-width: 1px; border-style: solid; padding: 10px; margin: 10px; background-color: #ababab; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color: #ffffff; } .datesubjectcomment a:hover { color: #ababab; } .commentboxpartial { border-color: #999999; border-width: 0px; border-style: solid; padding: 10px; margin: 10px; background-color: #ffffff; } .commentinfo { background-color: #ffffff; margin-top: 10px; width: 100%; } .skiplinks { text-align: center; } /*-------------------------------------------- Misc -----------------------------------------*/ .clear { height: 15px; }
to
to
Want the .psds? Leave a comment and I'll send you the link!
/*--------------------------------------------------- Layout by - likeacliche likeacliche.livejournal.com Layout Title - Sweet Green DO NOT DELETE THIS SECTION And thanks to http://irinafan.livejournal.com/ for the wonderful basic CSS -----------------------------------------------------*/ body { background-color: #c8c8c8; text-align: center; color: #000000; font-family: "Trebuchet MS", sans-serif; font-size: 9px; margin: 20px 0 20px 0; } a, a:link, a:visited { color: #565656; text-decoration: none; } a:hover { color: #ababab; text-decoration: none; } p, td, blockquote { font-family:"trebuchet ms"; background-color:#ffffff; padding:5px; border:0px dashed; color:#5fba53; } /*--------------------------------------------------------------------- General page alignment and width ------------------------------------------------------------------------*/ #content { width: 50%; margin-left: auto; margin-right: auto; background-color: #ffffff; border-width: 0px; border-style: solid; border-color: #999999; padding: 15px; } #maincontent { margin-top: 15px; font-family: "Arial", sans-serif; font-size: 9px; background-color: #ffffff; color: #000000; border-style: solid; border-color: #999999; border-width: 0px; text-align: center; } #sidebar { padding-top: 15px; margin-top: 15px; background-color: #c2cde0; border-color: #999999; border-width: 1px; border-style: solid; font-size: 11px; font-family: "Verdana", sans-serif; color: #000000; width: 160px; float: right; text-align: left; display: none; } /*----------------------------------------------------------------------------- Header --------------------------------------------------------------------------------*/ #header { width: 100%; padding: 10px 0px 20px 0px; margin: 0px; text-align: center; font-family: "Arial", sans-serif; font-size: 9px; font-weight: bold; letter-spacing: 2px; border-style: solid; border-color: #999999; border-width: 0px; background-color: #ffffff; color: #ababab; } .headerimage { /* for formatting header image */ position: relative; margin-left: auto; margin-right: auto; margin-bottom: 0px; width: 533px; height: 200px; background-image: url('http://i31.tinypic.com/15hcgi.png'); background-repeat: no-repeat; } /*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: #5fba53; } div#header a:hover, div#footer a:hover { color: #5fba53; text-decoration: none; } /*title and subtitle*/ .title { font-family: "Verdana", sans-serif; font-size: 11px; font-weight: normal; line-height: 200%; top: 10px; } .subtitle{ font-family: "Verdana", sans-serif; font-size: 11px; font-weight: normal; top: 10px; } /*----------------------------------------------------------------------------- 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: 0 3px 0 3px; } /*----------------------------------------------------------------------------- Entry stuff ------------------------------------------------------------------------*/ .subcontent { } .entry { margin: 0px 10px 10px 30px; padding: 10px; background-color: #ffffff; color: #ababab; font-family: "Arial", sans-serif; font-size: 9px; text-align: left; border-width: 0px; border-color: #919bad; border-style: solid; } .userpic { position: relative; float: left; background-color: #ffffff; padding: 5px; margin: 10px; z-index: 15; border-width: 0px; border-color: #919bad; border-style: solid; } .date { line-height: 200%; top: 2px; color: #757575; font-family: "Arial", sans-serif; font-size: 9px; } .subject { font-weight: bold; padding: 10px; color: #5fba53; font-family: "Arial", sans-serif; font-size: 12px; } .subject a, .subject a:link, .subject a:visited { color: #5fba53; } .subject a:hover { color: #ababab; } .datesubject { background-color: #ffffff; 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: "Arial", sans-serif; font-size: 9px; } /*--------------------------------------------------------------------- Entry Stuff - Comments ------------------------------------------------------------------------*/ .comments { font-family: "Arial", sans-serif; font-size: 9px; text-align: right; background-color: #ffffff; padding: 0px 5px 0px 5px; position: relative; top: 15px; } div.comments a, div.comments a:link, div.comments a:visited{ color: #5fba53; } div.comments a:hover { color: #757575; text-decoration: none; } /*--------------------------------------------------------------------- Entry Stuff - Separator ------------------------------------------------------------------------*/ .separator{ /* for formatting separators between entries */ height: 35px; } /*------------------------------------------------------------ Special friends page customization -------------------------------------------------------------------------------*/ .userpicfriends { position: relative; float: left; padding: 5px; margin: 10px; text-align: center; border-style: solid; border-width: 0px; border-color: #919bad; font-family: "Arial", sans-serif; font-size: 9px; 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: #5674b9; } div#sidebar a:hover { color: #7aa1f8; 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: #000000; border-width: 1px; border-style: solid; background-color: #d4dce8; 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 { padding-left: 15px; list-style: none; border-style: solid; border-width: 1px; border-color: #999999; background-color: #919bad; margin-bottom: 10px; margin-top: 10px; } /*---------------------------------------------------- Footer ----------------------------------------------------------------*/ #footer { width: 100%; text-align: center; font-family: "Arial", sans-serif; font-size: 9px; font-weight: bold; letter-spacing: 1px; background-color: #ffffff; color: #5fba53; border-color: #999999; border-width:0px; border-style: solid; z-index: 100; clear: both; } ul.navfooter{ padding: 0px; margin: 0px; } ul.navfooter li { display: inline; margin: 0 5px 0 5px; } .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: 0px; border-style: solid; border-color: #999999; } table.yeartable td.yearday { background-color: #ffffff; text-align: center; } td.yearmonth { border-style: none; } /*---------------------------------------------------- Comments pages ----------------------------------------------------------------*/ .datesubjectcomment { background-color: #ffffff; padding: 5px; margin-top: 20px; } .userpiccomment { position: relative; border-width: 5px; border-style: solid; border-color: #ffffff; background-color: #ffffff; top: -30px; left: 0px; padding: 5px; margin: 10px 10px -20px 10px; z-index: 15; float: left; border-width: 0px; border-color: #919bad; border-style: solid; } .box { border-style: solid; border-width: 1px 0px 0px 0px; border-color: #999999; padding: 10px; clear: left; } input, textarea { background-color: #d4dce8; color: #000000; } textarea.textbox { width: 100% !important; } .reply { position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: left; font-family: "Arial", sans-serif; font-size: 9px; line-height: 125%; background-color: #ffffff; color: #ababab; } .replytosubject { font-weight: bold; } .commentreply { position: relative; margin: 10px; font-size: 11px; font-family: "Arial", sans-serif; color: #ababab; } .commentbox { border-color: #5fba53; border-width: 1px; border-style: solid; padding: 10px; margin: 10px; background-color: #ababab; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color: #ffffff; } .datesubjectcomment a:hover { color: #ababab; } .commentboxpartial { border-color: #999999; border-width: 0px; border-style: solid; padding: 10px; margin: 10px; background-color: #ffffff; } .commentinfo { background-color: #ffffff; margin-top: 10px; width: 100%; } .skiplinks { text-align: center; } /*-------------------------------------------- Misc -----------------------------------------*/ .clear { height: 15px; }
to
to
Want the .psds? Leave a comment and I'll send you the link!