s2 Flexible Squares: Wallpapered

Apr 21, 2008 23:38

Style: S2 Flexible Squares
Resolution: 800 x 600 and higher
Browser: IE and Firefox
Nav bar: Yes
Ads: Not tested with ads
Custom comment page: No
Website: Not recommended



live preview | image preview


Rules:
- Credit exitclosed (for the stylesheet) and squidfingers.com (background pattern) with clear links in your userinfo.
- Change anything you like, but please still link back to me!
- Don't redistribute the codes, edited or not.

Codes

/*-------------------------------------------------------------------
S2 Flexible Squares Stylesheet
by xplastique.livejournal.com

Change anything you like, but you MUST credit me with a LINK BACK.

Please do not remove this section
------------------------------------------------------------------*/

/*-------------------------------------------------------------------
Basics
-------------------------------------------------------------------*/
body {
background-color: #ABABAB;
background-image: url(http://i32.tinypic.com/6fozfm.jpg);
text-align: justify;
color: #ABABAB;
font-family: Verdana;
font-size: 11px;
margin: 10px 0px 10px 0px;
}

a, a:link, a:visited {
cursor: default;
font-family: Georgia;
color: #DCA392;
border-bottom: 1px dotted #AFB9AA;
text-decoration: none;
}
a:hover {
cursor: default;
font-family: Georgia;
color: #AFB9AA;
border-bottom: 1px dotted #DCA392;
text-decoration: none;
}

p, blockquote {
font-size: 10px;
padding: 20px;

}

code, kbd, pre, tt {
font-size: 10px;
padding: 20px;
}

/*-------------------------------------------------------------------
General page alignment and width
-------------------------------------------------------------------*/
#content {
width: 600px;
margin-left: auto;
margin-right: auto;
margin-top: 50px;
background-color: #FFFFFF;
border: 0px;
padding: 0px;
}

#maincontent {
float: right;
width: 600px;
margin-top: -20px;
background-color: #FFFFFF;
color: #ABABAB;
text-align: justify;
}

#sidebar {
display: none;
}

/*-------------------------------------------------------------------
Header and header image
-------------------------------------------------------------------*/
#header {
width: 600px;
margin: 50px 0px 0px 0px;
background-color: #C4CCBC;
padding-top: 3px;
text-align: center;
font-family: Georgia;
font-size: 20px;
font-weight: none;
color: #FFFFFF;
text-transform: lowercase;
}

div#header a, div#header a:link, div#header a:visited{
cursor: default;
color: #FFFFFF;
letter-spacing: 1px;
text-transform: lowercase;
text-decoration: none;
border: 0px !important;
}

div#header a:hover{
cursor: default;
color: #F1D8D1;
letter-spacing: 1px;
text-transform: lowercase;
text-decoration: none;
border: 0px !important;
}

.title {
visibility: hidden
}

.subtitle{
visibility: hidden
}

/*-------------------------------------------------------------------
Header links section
-------------------------------------------------------------------*/
ul.navheader {
padding: 0px;
margin: 0px;
}

ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}

/*-------------------------------------------------------------------
Entry stuff
-------------------------------------------------------------------*/
.entry {
margin: 0px 0px 0px 0px;
padding-left: 40px;
padding-right: 40px;
padding-bottom: 20px;
padding-top: 20px;
background-color: #FFFFFF;
font-weight: none;
text-align: justify;
font-size: 11px;
font-family: Verdana;
}

.userpic {
position: relative;
float: left;
text-align: center;
margin: 10px 10px 10px 10px;
padding: 5px;
background-color: transparent !important;
color: #DCA392 !important;
}

.userpic img {
position: relative;
background-color: #FFFFFF;
padding: 5px;
}

.date {
text-align: left;
line-height: 100%;
text-decoration: italic;
color: #C0C0C0;
font-family: Verdana;
font-size: 11px;
padding-top: 3px;
}
.subject {
padding: 5px;
text-align: left;
color: #AFB9AA;
font-family: Georgia;
font-size: 24px;
text-transform: lowercase;
letter-spacing: 2px;
line-height: 24px;
}

.subject a, a:link, a:visited {
cursor: default;
font-family: Georgia;
color: #DCA392;
border-bottom: 1px dotted #AFB9AA;
text-decoration: none;
}

.subject a:hover {
cursor: default;
font-family: Georgia;
color: #AFB9AA;
border-bottom: 1px dotted #DCA392;
text-decoration: none;
}

.datesubject {
background-color: #FFFFFF;
padding: 2px;
border-bottom: 1px dotted #DCA392;
}

.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 {
color: #ABABAB;
font-family: Verdana;
font-size: 9px;
}

/*-------------------------------------------------------------------
Entry Stuff - Comments
-------------------------------------------------------------------*/
.comments {
font-family: Georgia;
font-size: 16px;
text-align: right;
letter-spacing: 2px;
padding: 10px 10px 10px 10px;
position: relative;
top: 15px;
}

div.comments a, div.comments a:link, div.comments a:visited{
cursor: default;
font-family: Georgia;
color: #DCA392;
border-bottom: 1px dotted #AFB9AA;
text-decoration: none;
}

div.comments a:hover {
cursor: default;
font-family: Georgia;
color: #AFB9AA;
border-bottom: 1px dotted #DCA392;
text-decoration: none;
}

/*-------------------------------------------------------------------
Entry Stuff - Separator
-------------------------------------------------------------------*/
/* for formatting separators between entries */

.separator{
height: 20px;
background-color: #FFFFFF !important;
}

/*-------------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------*/
.userpicfriends {
position: relative;
float: left;
text-align: center;
margin: 10px 10px 10px 10px;
padding: 5px;
background-color: transparent !important;
color: #DCA392 !important;
}

.userpicfriends img {
background-color: #FFFFFF;
padding: 5px;
}

/*-------------------------------------------------------------------
Footer
-------------------------------------------------------------------*/
#footer {
width: 100%;
color: #FFFFFF;
font-family: Georgia;
font-size: 18px;
background-color: #C4CCBC;
clear: none;
text-align: center;
}

div#footer a, div#footer a:link, div#footer a:visited {
cursor: default;
font-family: Georgia;
color: #FFFFFF;
border-bottom: 0px !important;
text-decoration: none;
}

div#footer a:hover {
cursor: default;
font-family: Georgia;
color: #F1D8D1;
border-bottom: 0px !important;
text-decoration: none;
}

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

ul.navfooter li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
background: transparent;
text-align: center;
font-size: 18px;
text-transform: lowercase;
}

.clearfoot {
display: none;
}

/*-------------------------------------------------------------------
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: 1px dotted #B3F652;
}

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

td.yearmonth {
border-style: none;
}

/*-------------------------------------------------------------------
Misc
-------------------------------------------------------------------*/
.clear {height: 0px;}

.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 {
color: #ABABAB;
font-family: Verdana;
font-size: 9px;
}

/*-------------------------------------------------------------------
Misc
-------------------------------------------------------------------*/
.clear {height: 0px;}

Note:
You may want to upload the background to your own image host, this one is on tinypic and I cannot guarantee how long it will be up for.

Instructions:
1. Go to Journal >> Customize Journal
2. To get S2 Flexible Squares, type 'Flexible Squares' into the Search box.
3. Choose any one of them, and Apply it.
4. Now click 'Customize Theme'
5. Press 'Custom CSS' on the left
6. Choose 'No' for all the drop down boxes.
7. Paste the codes in.
8. Save.

* layouts

Previous post Next post
Up