Typewriter layout

Jun 25, 2012 19:28

I've seen a few layouts that use Courier New for things other than code and I didn't like it much - I just think this font doesn't look good except for code. But then I had the idea for a typewriter layout and well, here the font really fits!
Don't worry, code is highlighted to make it distinguishable from normal text.

Typewriter

preview



Click here for live preview, then click on the layout's icon.



layout info
Based on Flexible Squares.
Works for all account types.
Tested in Firefox 13, Google Chrome 19 and Internet Explorer 9.

This layout's width not flexible.
The codes I put in for strike and underline don’t work properly in IE.

how to implement this layout
Go to the Customize Journal page.

Make sure Style System is S2.

Choose the Flexible Squares layout.

Go to Custom CSS
» Use layout's stylesheet(s): No
» Use layout's stylesheet(s) when including custom external stylesheet: No
» Use external stylesheets: No
insert custom stylesheet

/* Typewriter
http://fuesch.livejournal.com/33074.html */

body {
margin: 0px;
padding: 0px;
text-align: center;
font-family: "Courier New", Courier, monospace;
color: #272922;
font-size: 12px;
line-height: 120%;
background: #FFFFFF;
}

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

a:visited {
color: #E54343;
text-decoration: none;
}

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

a:active {
color:#FF0000;
text-decoration: underline;
}

code, kbd, pre, tt {
padding: 0px 2px;
font-family: "Courier New", Courier, monospace;
font-size: 12px;
color: #000000;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

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

blockquote {
padding: 0px 0px 0px 17px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left top repeat-y;
}

q {
font-style: italic;
}

q i {
font-style: normal;
}

strike, s {
padding: 0px 2px;
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) center left repeat-x;
}

u {
padding: 0px 1px;
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

/* ------- GENERAL ------- */

.clear {
display: none;
}

#content-outer {
margin: 0px auto;
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/typewriterbg.png) bottom center fixed no-repeat;
}

#content {
width: 680px;
margin: 0px auto;
padding: 0px 0px 209px 85px;
}

#header {
margin: 0px 30px 30px 30px;
padding: 0px;
text-align: center;
text-transform: uppercase;
}

ul.navheader {
margin: 0px 0px 5px 0px;
padding: 15px 0px;
letter-spacing: 1px;
}

ul.navheader li {
display: inline;
margin: 0px 2px;
}

ul.navheader li a {
padding: 15px 20px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center;
}

ul.navheader li a:hover {
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center top;
}

ul.navheader li a:active {
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.view {
padding: 15px 20px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center;
}

.title {
display: inline;
letter-spacing: 1px;
}

.subtitle {
display: inline;
padding: 0px 0px 0px 13px;
text-transform: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

#sidebar {
/*display: none;*/
float: right;
width: 200px;
margin: 0px;
padding: 30px 30px 280px 30px;
text-align: left;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.sbarbody2 {
margin: 0px 0px 25px 0px;
padding: 3px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

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

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

li.sbartitle {
margin: 0px;
padding: 0px 0px 3px 0px;
text-transform: uppercase;
list-style: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.tagcloud {
padding: 3px 0px;
list-style: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

li.sbaritem {
margin: 0px;
padding: 3px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

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

table.calendar {
margin: 0px auto;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.sbarcalendar, .sbarcalendarposts {
padding: 3px 6px 2px 6px;
text-align: right;
}

#maincontent {
margin: 0px;
padding: 30px 260px 70px 30px;
text-align: left;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center top;
}

#footer {
position: fixed;
width: 900px;
bottom: 10px;
right: 50%;
margin: 0px -450px 0px 0px;
padding: 0px;
text-align: center;
text-transform: uppercase;
letter-spacing: 1px;
z-index: 100;
clear: both;
}

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

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

div#footer a {
padding: 2px 5px;
text-shadow: #000000 1px 1px 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

div#footer a:hover {
text-decoration: none;
text-shadow: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.viewing {
padding: 2px 5px;
text-shadow: #C9CAC9 1px 1px 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/white20percent.png);
}

.clearfoot {
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
height: 288px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/typewriter.png) center no-repeat;
clear: both;
z-index: 50;
}

/* ------- ENTRIES & FRIENDS ------- */

.subcontent {
margin-bottom: 40px;
}

.userpic {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
padding: 0px;
background: none!important;
z-index: 15;
}

.userpicfriends {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
padding: 0px;
text-align: right;
background: none!important;
z-index: 15;
}

.userpicfriends font {
color: #EB0000;
}

.datesubject {
padding: 0px 0px 6px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.date, .replytoposter {
display: inline;
}

.subject, .replytosubject {
display: inline;
padding: 0px 0px 0px 11px;
text-transform: uppercase;
letter-spacing: 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.entry {
margin: 0px;
padding: 10px 0px 0px 0px;
text-align: left;
}

.ljtags {
margin-top: 10px;
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.currents {
margin-top: 10px;
}

.currents strong {
font-weight: normal;
}

.currentmood, .currentmusic, .currentlocation {
display: inline;
margin-right: 7px;
padding: 0px 0px 0px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.currentmood img {
padding-right: 5px;
}

.comments {
margin-top: 10px;
padding: 6px 0px 0px 0px;
text-align: left;
color: #EEEEF0;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) top left repeat-x;
overflow: hidden;
}

.comments a {
margin: 0px -5px 0px -10px;
padding: 0px 0px 0px 11px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

.separator {
display: none;
}

/* ------- COMMENTS ------- */

.skiplinks {
margin-bottom: 20px;
padding: 0px;
text-align: left;
color: #EEEEF0;
overflow: hidden;
}

.skiplinks a {
margin: 0px -5px 0px -10px;
padding: 0px 0px 0px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

.box {
padding: 0px;
}

.box center {
margin-bottom: 30px;
}

.box + .box center {
margin-top: 10px;
}

.commentbox {
margin: 0px 0px 40px 0px;
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) bottom left repeat-y;
}

.datesubjectcomment {
margin: 0px;
padding: 0px 5px 6px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.datesubjectcomment br {
display: none;
}

.datesubjectcomment strong {
padding-left: 12px;
font-weight: normal;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.userpiccomment {
position: relative;
float: left;
margin: 0px 10px 5px 0px;
z-index: 15;
}

.commentreply {
margin: 0px;
padding: 10px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) bottom right repeat-y;
}

.commentreply + div {
margin: 0px!important;
padding: 0px 12px;
font-size: 12px!important;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) top right repeat-y;
}

.commentreply + div div {
margin: 0px -12px;
padding: 3px 12px 5px 12px !important;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.commentboxpartial {
margin: 0px 0px 40px 0px;
padding: 5px 10px;
border: 1px dashed #272922;
}

/* Typewriter
*/

body {
margin: 0px;
padding: 0px;
text-align: center;
font-family: "Courier New", Courier, monospace;
color: #272922;
font-size: 12px;
line-height: 120%;
background: #FFFFFF;
}

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

a:visited {
color: #E54343;
text-decoration: none;
}

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

a:active {
color:#FF0000;
text-decoration: underline;
}

code, kbd, pre, tt {
padding: 0px 2px;
font-family: "Courier New", Courier, monospace;
font-size: 12px;
color: #000000;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

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

blockquote {
padding: 0px 0px 0px 17px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left top repeat-y;
}

q {
font-style: italic;
}

q i {
font-style: normal;
}

strike, s {
padding: 0px 2px;
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) center left repeat-x;
}

u {
padding: 0px 1px;
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

/* ------- GENERAL ------- */

.clear {
display: none;
}

#content-outer {
margin: 0px auto;
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/typewriterbg.png) bottom center fixed no-repeat;
}

#content {
width: 680px;
margin: 0px auto;
padding: 0px 0px 209px 85px;
}

#header {
margin: 0px 30px 30px 30px;
padding: 0px;
text-align: center;
text-transform: uppercase;
}

ul.navheader {
margin: 0px 0px 5px 0px;
padding: 15px 0px;
letter-spacing: 1px;
}

ul.navheader li {
display: inline;
margin: 0px 2px;
}

ul.navheader li a {
padding: 15px 20px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center;
}

ul.navheader li a:hover {
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center top;
}

ul.navheader li a:active {
text-decoration: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.view {
padding: 15px 20px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center;
}

.title {
display: inline;
letter-spacing: 1px;
}

.subtitle {
display: inline;
padding: 0px 0px 0px 13px;
text-transform: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

#sidebar {
/*display: none;*/
float: right;
width: 200px;
margin: 0px;
padding: 30px 30px 280px 30px;
text-align: left;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.sbarbody2 {
margin: 0px 0px 25px 0px;
padding: 3px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

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

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

li.sbartitle {
margin: 0px;
padding: 0px 0px 3px 0px;
text-transform: uppercase;
list-style: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.tagcloud {
padding: 3px 0px;
list-style: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

li.sbaritem {
margin: 0px;
padding: 3px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

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

table.calendar {

margin: 0px auto;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.sbarcalendar, .sbarcalendarposts {
padding: 3px 6px 2px 6px;
text-align: right;
}

#maincontent {
margin: 0px;
padding: 30px 260px 70px 30px;
text-align: left;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) center top;
}

#footer {
position: fixed;
width: 900px;
bottom: 10px;
right: 50%;
margin: 0px -450px 0px 0px;
padding: 0px;
text-align: center;
text-transform: uppercase;
letter-spacing: 1px;
z-index: 100;
clear: both;
}

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

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

div#footer a {
padding: 2px 5px;
text-shadow: #000000 1px 1px 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

div#footer a:hover {
text-decoration: none;
text-shadow: none;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/paper.png) right top;
}

.viewing {
padding: 2px 5px;
text-shadow: #C9CAC9 1px 1px 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/white20percent.png);
}

.clearfoot {
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
height: 288px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/typewriter.png) center no-repeat;
clear: both;
z-index: 50;
}

/* ------- ENTRIES & FRIENDS ------- */

.subcontent {
margin-bottom: 40px;
}

.userpic {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
padding: 0px;
background: none!important;
z-index: 15;
}

.userpicfriends {
position: relative;
float: right;
margin: 0px 0px 10px 10px;
padding: 0px;
text-align: right;
background: none!important;
z-index: 15;
}

.userpicfriends font {
color: #EB0000;
}

.datesubject {
padding: 0px 0px 6px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.date, .replytoposter {
display: inline;
}

.subject, .replytosubject {
display: inline;
padding: 0px 0px 0px 11px;
text-transform: uppercase;
letter-spacing: 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.entry {
margin: 0px;
padding: 10px 0px 0px 0px;
text-align: left;
}

.ljtags {
margin-top: 10px;
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.currents {
margin-top: 10px;
}

.currents strong {
font-weight: normal;
}

.currentmood, .currentmusic, .currentlocation {
display: inline;
margin-right: 7px;
padding: 0px 0px 0px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.currentmood img {
padding-right: 5px;
}

.comments {
margin-top: 10px;
padding: 6px 0px 0px 0px;
text-align: left;
color: #EEEEF0;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) top left repeat-x;
overflow: hidden;
}

.comments a {
margin: 0px -5px 0px -10px;
padding: 0px 0px 0px 11px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

.separator {
display: none;
}

/* ------- COMMENTS ------- */

.skiplinks {
margin-bottom: 20px;
padding: 0px;
text-align: left;
color: #EEEEF0;
overflow: hidden;
}

.skiplinks a {
margin: 0px -5px 0px -10px;
padding: 0px 0px 0px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left center no-repeat;
}

.box {
padding: 0px;
}

.box center {
margin-bottom: 30px;
}

.box + .box center {
margin-top: 30px;
}

.commentbox {
margin: 0px 0px 40px 0px;
padding: 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) bottom left repeat-y;
}

.datesubjectcomment {
margin: 0px;
padding: 0px 5px 6px 0px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.datesubjectcomment br {
display: none;
}

.datesubjectcomment strong {
padding-left: 12px;
font-weight: normal;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

.userpiccomment {
position: relative;
float: left;
margin: 0px 10px 5px 0px;
z-index: 15;
}

.commentreply {
margin: 0px;
padding: 10px 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) bottom right repeat-y;
}

.commentreply + div {
margin: 0px!important;
padding: 0px 12px;
font-size: 12px!important;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) top right repeat-y;
}

.commentreply + div div {
margin: 0px -12px;
padding: 3px 12px 5px 12px !important;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) bottom left repeat-x;
}

.commentboxpartial {
margin: 0px 0px 40px 0px;
padding: 5px 10px;
border: 1px dashed #272922;
}

#postform table {
border: none!important;
}

#qrform table {
margin-bottom: 30px;
border: none!important;
}

.commentbox #qrform table {
margin-bottom: 0px;
border: none!important;
}

input, textarea {
color: #272922;
padding: 2px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/white20percent.png);
}

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

/* ------- CALENDAR ------- */

ul.year {
margin: 0px 0px 35px 0px;
padding: 0px;
text-align: left;
}

ul.year li {
padding: 0px 2px 0px 0px;
display: inline;
}

ul.year li + li {
padding-left: 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

table.yeartable {
margin: 0px;
}

td.yearmonth {
text-transform: uppercase;
letter-spacing: 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
border-style: none;
}

td.yearmonth a {
text-transform: none;
letter-spacing: normal;
border-style: none;
}

table.yeartable td.yearday {
padding-bottom: 3px;
text-align: center;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

table.yeartable td.yeardate {
padding: 3px 4px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

.lj-view-month #maincontent form center {
text-align: left;
}

.lj-view-month #maincontent form br, .lj-view-month #maincontent form + br, .lj-view-month #maincontent form + br + br {
display: none;
}

.lj-view-month dt {
margin: 30px 0px 0px 0px;
padding: 0px;
}

.lj-view-month dd {
margin: 0px 0px 0px 25px;
padding: 2px 0px 2px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) left 2px repeat-y;
}

.lj-view-day .skiplinks {
margin-bottom: 35px;
}

/* ------- TAGS ------- */

.lj-view-tags h2 {
margin: 0px;
padding: 0px 0px 3px 0px;
font-size: 12px;
font-weight: normal;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.ljtaglist {
margin: 0px;
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) left 4px repeat-y;
}

ul.ljtaglist {
list-style: none;
}

ul.ljtaglist li {
padding: 5px 0px;
}

input, textarea {
color: #272922;
padding: 2px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/white20percent.png);
}

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

/* ------- CALENDAR ------- */

ul.year {
margin: 0px 0px 35px 0px;
padding: 0px;
text-align: left;
}

ul.year li {
padding: 0px 2px 0px 0px;
display: inline;
}

ul.year li + li {
padding-left: 12px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/slash.png) left 2px no-repeat;
}

table.yeartable {
margin: 0px;
}

td.yearmonth {
text-transform: uppercase;
letter-spacing: 1px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
border-style: none;
}

td.yearmonth a {
text-transform: none;
letter-spacing: normal;
border-style: none;
}

table.yeartable td.yearday {
padding-bottom: 3px;
text-align: center;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

table.yeartable td.yeardate {
padding: 3px 4px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/black20percent.png);
}

.lj-view-month #maincontent form center {
text-align: left;
}

.lj-view-month #maincontent form br, .lj-view-month #maincontent form + br, .lj-view-month #maincontent form + br + br {
display: none;
}

.lj-view-month dt {
margin: 30px 0px 0px 0px;
padding: 0px;
}

.lj-view-month dd {
margin: 0px 0px 0px 25px;
padding: 2px 0px 2px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) left 2px repeat-y;
}

.lj-view-day .skiplinks {
margin-bottom: 35px;
}

/* ------- TAGS ------- */

.lj-view-tags h2 {
margin: 0px;
padding: 0px 0px 3px 0px;
font-size: 12px;
font-weight: normal;
text-transform: uppercase;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dash.png) left bottom repeat-x;
}

.ljtaglist {
margin: 0px;
padding: 0px 0px 0px 10px;
background: url(http://fatfrog.info/Ma/A/layout/typewriter/dots.png) left 4px repeat-y;
}

ul.ljtaglist {
list-style: none;
}

ul.ljtaglist li {
padding: 5px 0px;
}

This layout is a bit narrow - if you want to make the maincontent wider and don’t need the sidebar, take out the slashes and asterisks that surround the sidebar’s display: none; line. And change the second number in maincontent’s padding to 30.









This profile layout has a fixed width, changing the width would mess up the layout.

Go to Edit Profile and insert the code into the Bio part.
To copy the code, click in the text area and then press Ctrl+A and Ctrl+C.







http://fatfrog.info/Ma/A/layout/typewriter/profile-paper-top.png" />
http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-outerleft.png">http://fatfrog.info/Ma/A/layout/typewriter/profile-paper-left.png" valign="bottom">
http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-left.png">
http://fatfrog.info/Ma/A/layout/typewriter/profile-paper.png" valign="bottom">

CONTENT GOES HERE

http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-middle.png">


http://fatfrog.info/Ma/A/layout/typewriter/profile-paper-right.png" valign="bottom">
http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-right.png">
http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-outerright.png">
http://fatfrog.info/Ma/A/layout/typewriter/profile-typewriter-bottom.png" />



You don't have to use the lj-raw tags. With them you can only make line breaks/new paragraphs with
and
. Without the lj-raw tags you can also create line breaks and new paragraphs just by hitting the enter key.

If you want to change the link color, put a font tag with a different color in your link. Like so:
LINK TEXT









- layouts, miscellaneous

Previous post Next post
Up