S2 Flexible Squares [Knock On Wood]

Sep 07, 2008 21:57


A new layout. I really wanted to try some wood textures, and I like the result.
I hope you like it too. :D



Live preview | Image preview





Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 003 [Knock On Wood] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (6 and higher), Firefox, Safari and Chrome ***********************************************************/ /*****BASICS*****/ body{background:#2a211b url(http://www.mentahelada.net/lj-layouts/layout003/bg-wood.png) top left repeat;font-family:Georgia, "Times New Roman", Times, serif;color:#666;font-size:100%;padding:0;margin:0;} blockquote{background:#fff url(http://www.mentahelada.net/lj-layouts/layout003/'');border:1px solid #dbdbdb;text-align:left;margin:auto;padding:20px;width:70%;} p,td{font-size:inherit;} code,kbd,pre,tt{font-family:monospace;} ::-moz-selection{background:#f0e648;color:#666;} b,strong{font-weight:bold;color:#ec4c1e;} i,em{font-style:italic;} a,a:link,a:visited{background:transparent;color:#ec4c1e;text-decoration:none;} a:hover{color:#ec4c1e;text-decoration:underline;} .ippu{font-size:11px;} a{outline:none;} a img{border:0;} /*****LAYOUT*****/ #content{background:transparent;width:960px;margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;padding:0;height:100%;} #header{background:#ec4c1e url(http://www.mentahelada.net/lj-layouts/layout003/bg-header-gender.png) top left repeat;font-family:Impact, "Trebuchet MS", Verdana, Helvetica, sans-serif;font-size:2.1875em;margin:0;padding:80px 10px 30px;text-align:center;width:auto;} #sidebar{background:transparent;font-size:0.6875em;float:left;margin:10px 0;padding:0 0 10px;text-align:left;width:230px;} #maincontent{background:transparent;margin:0 0 0 250px;padding-top:10px;padding-bottom:0;font-size:0.75em;} #footer{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/bg-sidetitle-gender.png) bottom left repeat-x;font-family:Impact, "Trebuchet MS", Verdana, Helvetica, sans-serif;font-size:2em;margin:0;padding:10px;text-align:center;width:auto;} /*****HEADER*****/ ul.navheader{padding:0;margin:0;} ul.navheader li{display:inline;list-style:none;padding:0;margin:0;} #header li.view{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');border-bottom:5px solid #f0e648;color:#f9f9f9;text-transform:uppercase;text-decoration:none;margin:0;padding:5px 10px;} #header a,#header a:link,#header a:visited{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');border:0;color:#f9f9f9;text-transform:uppercase;text-decoration:none;margin:0;padding:5px 10px;} #header a:hover{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');border-top:5px solid #f0e648;color:#f9f9f9;text-transform:uppercase;text-decoration:none;margin:0;padding:5px 10px;} .title,.subtitle{display:none;} /*****SIDEBAR*****/ .defaultuserpic{display:none;margin:15px auto;text-align:center;} li.sbartitle{list-style:none;color:#f0e648;font-family:Impact, "Trebuchet MS", Verdana, Helvetica, sans-serif;font-size:3.1818em;line-height:1em;background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/bg-sidetitle-gender.png) bottom left repeat-x;margin:15px 0 0;padding:0 0 15px;text-align:left;text-transform:uppercase;} .sbarbody{padding:0;margin:0;} .sbarbody2{background-color:#f9f9f9;padding:5px;} div#sidebar a,div#sidebar a:link,div#sidebar a:visited{color:#666;text-decoration:none;text-transform:none;} div#sidebar a:hover{color:#ec4c1e;} table.calendar{margin:auto;width:100%;} ul.sbarlist{list-style:none;margin:0;padding:0;} li.sbaritem{background:#f9f9f9;border-left:10px solid #f0e648;color:#666;text-decoration:none;text-transform:none;text-align:left;padding:7px;margin:1px;} #sidebar_linklist li.sbaritem a,#sidebar_tags li.sbaritem a{display:block;} #sidebar_linklist li.sbaritem:hover,#sidebar_tags li.sbaritem:hover{background:#f9f9f9;border-left:10px solid #ec4c1e;color:#666;} #sidebar_summary li.sbaritem{background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout003/'');border-left:10px solid #f0e648;display:block;color:#666;text-decoration:none;text-transform:none;text-align:left;padding:7px;margin:1px;} #sidebar_summary li.sbaritem:hover{display:block;background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout003/'');border-left:10px solid #ec4c1e;color:#666;} .sbarcalendar{background:#fff;border:1px solid #fff;color:#666;font-size:1em;padding:2px;text-align:center;} .sbarcalendarposts{background:#ec4c1e;border:1px solid #ec4c1e;font-size:1em;padding:1px;text-align:center;} .sbarcalendarposts a,.sbarcalendarposts a:link,.sbarcalendarposts a:visited{color:#fff !important;} .sbarcalendarposts a:hover{color:#fff;text-decoration:underline !important;} /*****FOOTER*****/ ul.navfooter{padding:0;margin:0;} ul.navfooter li{display:inline;list-style:none;padding:0;margin:0;} #footer li.viewing{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');color:#f0e648;text-transform:uppercase;text-decoration:none;margin:0;padding:5px 10px;} #footer a,#footer a:link,#footer a:visited{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');border:0;color:#f9f9f9;text-transform:uppercase;text-decoration:none;margin:0;padding:5px 10px;} #footer a:hover{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/'');color:#f9f9f9;text-transform:uppercase;text-decoration:underline;margin:0;padding:5px 10px;} /*****ENTRY*****/ .subcontent{background:#f9f9f9;margin:0 0 20px;padding:0;} .entry{margin:0;padding:10px 170px 10px 20px;text-align:left;} .entry ul li{background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/entry-li-arrow.gif) left no-repeat;list-style:none;margin-left:10px;padding-left:11px;color:#666;} .entry ol li{list-style:lower-roman;margin-left:30px;padding-left:0;color:#666;} /*****USERPICS*****/ .userpic,.userpicfriends{background:#fff !important;border:1px solid #dbdbdb;font-size:0.7692em;text-align:center;text-transform:lowercase;color:#808080;float:right;margin:10px;padding:20px;position:relative;z-index:15;} .userpicfriends font{font-size:1em;text-align:center;text-transform:lowercase;color:#808080;} .userpic a,.userpic a:link,.userpic a:visited,.userpicfriends a,.userpicfriends a:link,.userpicfriends a:visited,userpicfriends font{color:#808080 !important;background:transparent;text-decoration:none;text-transform:lowercase;} .userpic a,.userpicfriends a:hover,userpicfriends a:hover font{color:#808080 !important;background:transparent;text-decoration:underline;text-transform:lowercase;} /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS*****/ .date{border:0;color:#808080;font-size:1em;text-align:right;text-transform:lowercase;margin-right:170px;padding:0;} .subject{color:#808080;font-size:1.5em;text-align:right;text-transform:uppercase;font-style:normal;font-weight:normal;margin-right:160px;padding:0 10px 0 0;border-bottom:1px solid #dbdbdb;} .subject a,.subject a:link,.subject a:visited{color:#808080;text-transform:uppercase;font-style:normal;font-weight:normal;} .subject a:hover{color:#ec4c1e;text-decoration:underline;} .datesubject{background:#f9f9f9;padding:20px 0 10px 10px;} .ljtags{border-top:1px solid #dbdbdb;text-align:left;margin:20px 0 0;padding:5px 0 0;color:#808080;font-size:0.9166em;font-weight:normal;} .currents{text-align:left;margin:0;padding:0;color:#808080;font-size:0.9166em;} .currents strong,.ljtags strong{color:#808080;font-weight:normal;} .ljtags a,.ljtags a:link,.ljtags a:visited,.currents a,.currents a:link,.currents a:visited{background:transparent;color:#ec4c1e;font-weight:normal;} .ljtags a:hover,.currents a:hover{color:#ec4c1e;text-decoration:underline;} .comments{text-align:left;margin:10px 0 0;padding:0;color:#ec4c1e;font-size:1em;letter-spacing:0.05em;text-transform:none;font-style:normal;font-weight:normal;} .comments a,.comments a:link,.comments a:visited{background:transparent;color:#ec4c1e;font-weight:normal;} .comments a:hover{color:#ec4c1e;text-decoration:underline;} /*****TAGS PAGE*****/ .ljtaglist a,.ljtaglist a:link,.ljtaglist a:visited{padding:1px;color:#5b5b5b;background:#f0e648;text-decoration:none;text-transform:none;} .ljtaglist a:hover{color:#f9f9f9;background:#ec4c1e;} .ljtaglist{width:100%;list-style:none;color:#808080;padding:0;margin:0;} .ljtaglist li{background:#f9f9f9;color:#808080;padding:10px 20px;margin:1px;} h2{list-style:none;color:#fff;font-family:Impact, "Trebuchet MS", Verdana, Helvetica, sans-serif;font-size:2.5em;line-height:1em;background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/bg-sidetitle-gender.png) bottom left repeat-x;margin:20px 0 0;padding:0 0 15px;text-align:right;text-transform:uppercase;} /*****CALENDAR PAGE*****/ ul.year{width:90%;list-style:none;text-align:center;margin-left:auto;margin-right:auto;padding:10px;} ul.year a,ul.year a:link,ul.year a:visited{padding:5px;color:#5b5b5b;background:#f0e648;text-decoration:none;text-transform:none;} ul.year a:hover{color:#f9f9f9;background:#ec4c1e;} ul.year li{color:#666;display:inline;} ul.year li.active{color:#f9f9f9;background:#ec4c1e;font-size:1.1538em;font-weight:normal;padding:5px;} table.yeartable{margin-left:auto;margin-right:auto;width:100%;padding:20px;background:#f9f9f9;} table.yeartable td.yeardate,table.yeartable td.yearday{color:#808080;border:1px solid #dbdbdb;height:4em;} table.yeartable td.yearday{background:#ccc;text-align:center;} td.yearmonth{color:#808080;} .yearmonth a,.yearmonth a:link,.yearmonth a:visited{padding:3px;color:#ec4c1e;background:transparent;text-decoration:underline;text-transform:none;} .yearmonth a:hover{color:#f9f9f9;background:#ec4c1e;} table.yeartable td.yeardate a,table.yeartable td.yeardate a:link,table.yeartable td.yeardate a:visited{display:block;font-family:Georgia, "Times New Roman", Times, serif;font-size:1.3333em;padding:5px;color:#ec4c1e;background:transparent;text-decoration:underline;text-transform:none;} table.yeartable td.yeardate a:hover{color:#f9f9f9;background:#ec4c1e;} /*****CLEARS, SKIPLINKS*****/ .clear{height:0;background:transparent;} .clearfoot{clear:both;height:0;background:transparent;} .separator{height:1px;background:transparent;} .skiplinks{border:0;text-transform:none;text-align:center;margin:auto;padding:10px;color:#808080;width:80%;background:transparent;} .skiplinks a,.skiplinks a:link,.skiplinks a:visited{padding:5px;color:#5b5b5b;background:#f0e648;text-decoration:none;text-transform:none;} .skiplinks a:hover{color:#f9f9f9;background:#ec4c1e;} /*****COMMENTS VIEW*****/ .datesubjectcomment{background:#f0f0f0;padding:5px;} .userpiccomment{background:#f9f9f9;border:1px solid #f0f0f0;position:relative;padding:5px;margin:-20px 10px 10px;z-index:15;float:left;} .box{background:#f9f9f9;font-size:1em;padding:10px;clear:right;} input,textarea{background-color:#fff;color:#666;} textarea.textbox{width:95%;} .reply{position:relative;margin:5px;padding:5px;text-align:left;background-color:#fff;color:#808080;} .replytosubject{font-weight:normal;} .commentreply{position:relative;padding:5px;color:#808080;} .commentbox{border:1px solid #f0f0f0;padding:10px;margin:10px;background-color:#fff;} .datesubjectcomment a:link,.datesubjectcomment a:visited{color:#ec4c1e;text-decoration:none;} .datesubjectcomment a:hover{color:#ec4c1e;text-decoration:underline;} .commentboxpartial{border:1px solid #f0f0f0;padding:10px;margin:10px;background-color:#fff;} .commentinfo{background-color:#fff;margin-top:10px;width:100%;} #qrform table{border:1px solid #fff !important;height:auto;} /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://passing_girl.livejournal.com/ and http://www.icojoy.com/*****/ .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-user-orange.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-user-orange.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-group-orange.gif) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #sidebar_summary img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_private.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #lj_controlstrip .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-user-orange.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-user-orange.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout003/icon-group-orange.gif) no-repeat; padding: 16px 16px 0 0!important; } /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#fff!important; border:1px solid color:#ec4c1e!important; color:#808080!important; font-family:Georgia, "Times New Roman", Times, serif; font-size:1em; font-weight:100!important; padding:5px; } div.ContextualPopup .Content { font-weight:100!important; margin-right:50px; } div.ContextualPopup .Relation { font-size:1.2727em/*14px*/; font-weight:100!important; } div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited { color:#ec4c1e!important; font-family:Georgia, "Times New Roman", Times, serif; font-weight:100; text-decoration:none!important; } div.ContextualPopup div.Inner a:hover{ color:#999!important; font-family:Georgia, "Times New Roman", Times, serif; font-weight:100; text-decoration:underline!important; }

LAYOUT INFO:
  • Style: Flexible Squares
  • Account level: Basic, Paid, Plus
  • Tested on: IE (6 and higher), Firefox Safari and Chrome.

IMAGES:
Please upload the images to your own server. Thanks.

,
, Wood texture
User, community, locked/protected icons:

(by Passing Girl),
(by Icojoy)
List item:

Pride & Prejudice icon in the live preview made by me. Find it here.
BASIC INSTRUCTIONS:
  1. Choose a Flexible Squares layout
  2. Go to Customize Journal Theme
  3. Select NO in the dropdowns
  4. Leave "Custom External Stylesheet" empty
  5. Paste the CSS that I give you in the "Custom Stylesheet" box
  6. Save.
  • Make changes if you know how (but still credit me!)
  • Ask if you have doubts, I'll try to answer asap

ADDING A HEADER:

If you want a header in yout layout, add this at the end of the code:
.headerimage {
position:relative;
margin:0 auto;
background-repeat:no-repeat;
background-image:url('ADD HERE YOUR URL');
width:0px;
height:0px;
}
And change the url to your own. Also, change the width and height lines so they fit your image size.

EASY RULES:
  • Credit frozen_mint if you use. Please don't credit mintyapple, please change the credit you have in your userinfo. Thanks!
  • Comment if you like / if you take

maker: yam, style: flexible squares

Previous post Next post
Up