( layout ) sensibility.

Feb 22, 2011 09:22



live | image

/* -- s e n s i b i l i t y
layout by prix @ lj
flexible squares

feel free to edit, but please do not remove credit from css. */

body {
width: 500px;
background-attachment: fixed;
background-color: #fff;
background-image: url(http://i53.tinypic.com/aw6ah0.png);
background-repeat: repeat;
text-align: justify;
color: #000;
font-family: "trebuchet ms", sans-serif;
font-size: 10px;
}

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

a:hover {
color: #000;
text-decoration: none;
}

p, td, blockquote {
font-family: "trebuchet ms", sans-serif;
font-size: 10px;
color: #4185E5;
}

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

#content
{
width: 600px;
margin-left: 450px;
padding: 15px;
}

#maincontent {
width: 400px;
margin-top: 15px;
font-family: "trebuchet ms", sans-serif;
font-size: 11px;
color: #000000;
text-align: justify;
}

#header {
display: none;
}

.subcontent {

}

.entry {
width: 400px;
margin: 0px 0px 0px -100px;
padding: 20px;
background-color: #fff;
color: #000;
font-family: "trebuchet ms", sans-serif;
font-size: 11px;
text-align: justify;
}

.userpic {
position: relative;
float: left;
padding: 15px;
background-color: #fff;
margin-left: -200px !important;
z-index: 15;
}

.userpicfriends {
position: relative;
float: left;
padding: 15px;
background-color: #fff;
margin-left: -200px !important;
z-index: 15;
font-family: "courier new", sans-serif;
font-size: 11px;
color: #000;
text-align: center;
text-transform: uppercase;
}

.userpic img, .userpicfriends img {
width: 75px;
height: 75px;
}

.date {
display: none;
}

.subject {
font-weight: bold;
padding: 2px;
color: #000000;
font-family: "courier new", sans-serif;
font-size: 20px;
letter-spacing: -1px;
text-align: right;
text-transform: uppercase;
}

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

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

.entry ul li {
display: none;
}

.entry ol li {
display: none;
}

.currents, .currentmood, .currentmusic {
display: none;
}

.separator{
height: 10px;
}

#sidebar {
padding: 20px;
position: fixed;
width: 200px;
margin-top: 40px;
margin-left: 500px;
background-color: #fff;
border-color: #fff;
border-width: 0px;
font-size: 12px;
font-family: "courier new", sans-serif;
color: #000000;
letter-spacing: -1px;
text-align: justify;
text-transform: lowercase;
}

.defaultuserpic {
text-align: center;
padding: 10px;
}

.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{
font-size: 16px;
font-weight: bold;
color: #4185E5;
text-decoration: none;
text-transform: uppercase;
}

div#sidebar a:hover {
font-size: 16px;
color: #4185E5;
color: #000;
text-decoration: none;
text-transform: uppercase;
}

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

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

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

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

.sbarcalendarposts {
border-color: #000000;
border-width: 1px;
border-style: solid;
background-color: #fff;
text-align: center;
font-family: "courier new", sans-serif;
font-size: 11px;
}

#footer {
width: 100%;
text-align: right;
font-family: "courier new", sans-serif;
font-size: 14px;
font-weight: bold;
letter-spacing: 1px;
color: #4185E5;
z-index: 100;
clear: both;
}

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

ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}

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 {
background-color: #fff;
border-width: 1px;
border-style: dotted;
border-color: #4185E5;
}

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

td.yearmonth {
background-color: #fff;
border-style: none;
}

.clearfoot {
clear: both;
}

/* -- TINYICONS --*/

.ljuser img {
width: 0;
height: 0;
background: transparent url() no-repeat 0 0;
padding: 7px 7px 0px 0px !important;
vertical-align: baseline !important;
}

.ljuser img[src*="userinfo.gif"] {
background: transparent url(http://i53.tinypic.com/30skkmb.png) no-repeat 0 0 !important;
padding: 16px 16px 0px 0px !important;
}

.ljuser img[src*="community.gif"] {
width: 0;
height: 0;
background: transparent url(http://i52.tinypic.com/xof8gn.png) no-repeat scroll 0 0 !important;
padding: 12px 17px 0px 0px !important;
}

img[src*='icon_protected.gif'] {
width: 0;
height: 0;
background: url('http://i54.tinypic.com/ohtkx1.png') no-repeat;
padding: 16px 20px 0 0;
}

img[src*='icon_private.gif'] {
width: 0;
height: 0;
background: url('http://i56.tinypic.com/28anbrl.png') no-repeat;
padding: 13px 16px 0 0;
}

img[src*='icon_groups.gif'] {
width: 0;
height: 0;
background: url('http://i55.tinypic.com/zwx1yo.png') no-repeat;
padding: 16px 20px 0 0;
}

❶ Select FLEXIBLE SQUARES.
➋ Make sure all drop-down boxes say NO and copy+paste the code HERE.
➌ About the sidebar: your default navigational links have to be implemented manually. Turn everything off except for LINKS and BLURB.
➍ This layout has been tested in Mozilla Firefox & Google Chrome.
➎ Feel free to ask any questions and I'll do my best to answer them.
➏ Edit as you see fit as long as you keep the credit!
➐ Thanks for dropping by!

type: layout, !user: annay

Previous post Next post
Up