Pink City - S2 3 Column Layout

Designer's Comments

Look carefully for specific instructions

INSTRUCTIONS:

NOTE: After each section that you change, you may be asked if you want to save your changes before going on to the next section. You must select YES each time.

STEP 1: Open http://www.livejournal.com/customize/#layout in a new window

STEP 2: The Title section is completely optional, so if you would like to have a personalized journal title, subtitle, and friends list title, you can enter whatever your little heart desires, otherwise you can leave it blank. The link that talks about modifying your link list is pretty easy to follow once you click into it, having a link list is optional, and best saved until after you are finished installing your layout. In the Style System section, make sure you select S2.

STEP 3: Click on the box that says "theme,layout or designer". Type in 3 Column (it may automatically fill in) and hit search.

STEP 4: Click where it says "Appply Theme" under the FIRST layout style (Agent Orange). Don't worry about the colors, we will change them shortly.

STEP 5: Click where it says "Text". Here you decide what (if anything) you want to write in your "free text" area.

STEP 6: Click on the Custom CSS sub-tab. Select "No" where it says "Use layout's stylesheet(s)". Then Scroll down to where it says "Custom Style Sheet" and paste the codes that I have provided in this post.

STEP 7: Save your changes and enjoy your new layout!

Using This Layout

For specific instructions read designer's comments

1. Log into livejournal.com (customize)
2. Set Style System to S2
3. Click on Look and Feel
4. Set Layout to 3 Column
5. Click on Custom Options
6. Click on Custom CSS
7. Copy (ctrl c) and paste (ctrl v) code to Custom CSS

Layout Code

Copy and paste to Custom Style Sheet

Help

Set style to 3 Column

/*-------------------------------------------------------------------
   S2 3 Column
   Layout by autumn-mist@livejournal.com
   Header by shinbi@deviantart.com
----------------------------------------------------------------------*/
body { 
font-family: verdana, arial; 
font-size: 8pt;
color: #F8689B;
background: #000000 url('http://cbimg6.com/layouts/08/02/03/25180aa.png') top center repeat-y;
margin: 0;
}
a { 
color: #67141E; 
font-weight: normal; 
}
a:hover { 
color: #67141E; 
font-weight: normal; 
}
h1{ 
color: #F489BF; 
font-size: 13pt; 
text-align:left; 
padding:5px; 
margin:0px; 
border: 0;
border-bottom: 1px solid #FFD6F9;
}
h2{ 
border: 0;
font-size: 13px; 
text-align:center; 
margin:0px 0px; 
padding:0px; 
margin-bottom:15px; 
background-color: #FFCDE4; 
color: #F489BF;
}
h3{ 
color: #BE2C51; 
text-align:left; 
font-family: Arial; 
font-weight: bold;
padding:5px; 
margin:0px; 
border: 0;
}
ul.links{ 
margin: 0px 0px; 
padding: 2px 0px 2px 0px; 
color: #F8689B; 
list-style-type:none; 
}
li.links { 
margin-left: 0px; 
}
li.links a{ 
display:block;
padding:5px 0px 5px 0px;
border-bottom:1px solid #FE6C9D;
text-decoration:none;
width:130px; 
}
li.links a:hover {
background-color:#FFCDE4;
}
li.links_header{ 
font-size: 11px; 
border-bottom: 1px solid #F8689B; 
padding-top:7px; 
}
#container {
position:relative;
top: 0px;
width: 760px;
margin:auto;
}

/* friends list user account */
#leftbar{ 
position:absolute; 
width: 160px; 
border: 0;  
background-color: transparent;
top: 276px;
left: 50%;
margin: 0px -380px 0px -380px;
}

/* friends list comm account */
div#container #leftbar{ 
top: 0px;
left: 0;
margin: 0 !important;
margin: 0 0 0 -5px; 
}

/* friends list user account */
#rightbar{ 
position:absolute;
width: 160px; 
border: 0;  
background-color: transparent;
top: 276px;
left: 50%;
right: 0;
margin: 0px 218px 0px 218px;
}

/* friends list comm account */
div#container #rightbar{ 
top: 0; 
}

#leftbar a, #rightbar a {
color: #F8689B; 
font-weight: normal;
text-decoration:none;
}
#leftbar a:hover, #rightbar a:hover {
color: #67141E; 
}
.calendarActive{ 
font-weight:bold; 
}
.calendarActive a {
color: #F8689B; 
font-weight: bold;
text-decoration:none;
}
.calendarActive a:hover {
color: #F489BF; 
}
#leftbar .calendarActive a {
background-color:#FEE4F1;
color: #FFEDFF;
background-color:transparent;
padding:0px;
font-weight: normal;
}
#leftbar .calendarActive a:hover {
color: #FFFFFF; 
}
.sidebox div a img {
display:none;
}
.sidebox div span.ljuser a img {
display:inline;
}
#entries{ 
position:relative; 
margin: 0px 160px 0px 160px;
text-align:center; 
background-color: transparent; 
border: 0; 
padding:5px 5px 25px 5px; 
}
#readme { 
text-align:justify; 
padding: 2px; 
}
#header {
position:relative;
width: 760px;
margin:auto;
height: 423px;
background: #FFCDE4 url('http://cbimg6.com/layouts/08/02/03/25180ab.jpg') center top no-repeat;
}
div.entrylinks { 
font-family: Verdana; 
font-size: 8pt; 
text-align:right; 
padding:2px 10px 2px 10px; 
line-height:20px; 
margin:0px 0px 0px 0px; 
border-top: 2px solid #FFDEEE;
}
div.entrylinks a { 
background-color: transparent; 
text-decoration:none; 
margin:2px; 
padding:2px; 
}
div.entrylinks a:hover {
background-color: #FFDEEE;
}
div.entrylinks img { 
border:0px; 
text-decoration:none; 
}
div.commentlinks { 
font-family: Verdana; 
font-size: 8pt;  
padding:2px 10px 2px 10px; 
line-height:20px; 
}
div.commentlinks a { 
background-color: #E4E7F6; 
text-decoration:none; 
margin:2px; 
padding:2px; 
}
div.commentlinks a:hover {
background-color: transparent;
}
div.commentlinks img { 
border:0px; 
text-decoration:none; 
}
div.entry{ 
margin-bottom:35px;
}
div.entry h1{ 
color: #F489BF; 
font-size: 10pt; 
font-weight:bold; 
letter-spacing:1.5px; 
text-align:left; 
padding:3px; 
margin-right: 0;
border:0;
background-color:#FFDEEE;
}
.entrytext{ 
font-family: Verdana; 
font-size: 8pt;  
text-align:justify; 
color: #F8689B; 
width:420px;
margin-top: 30px;
line-height:16px;
overflow:auto;
}
.aboutentry{ 
text-align: left; 
margin-right:10px; 
height: 1%; 
font-weight: bold;
}
div.ljtags {
margin:0;
margin-top:6px;
padding:4px;
font-style: italic;
font-weight: normal;
}
.userpic{ 
margin:5px; 
}
.sidebox{ 
border: 0; 
background-color: transparent; 
margin: 10px; 
padding:5px; 
}
.userpic2{ 
position:relative; 
float:left; 
padding: 0px 5px 5px 0px;
margin:0px 0px 0px 0px;
}
.userpic_reply{ 
position:relative; 
float:left; 
padding: 5px;
}
.moodpic{ 
float: right; 
}
.blurb { 
color: #F8689B; 
}
.nosubject { 
font-style:italic; 
}
.replyform { 
text-align:left; 
clear: both;
padding-top:10px; 
}
.replyform textarea {
width: 98% !important;
}
.replyform input { 
border: 1px solid #333333;
font-size: 11px;
}
.replyform input:hover { 
background-color: #FFDEEE;
}
.replyform input#talkpostfromremote { 
border: 0;
}
.replyform input#prop_opt_preformatted, .replyform input#spellcheck { 
border: 0;
}
.comment_postedby { 
text-align:left; 
font-weight:bold;
}
.comment_date{ 
text-align:left; 
}
.comment_info .comment_date{
padding-bottom:8px;
}
.comment_subject { 
color: #F489BF; 
font-size: 8pt; 
font-weight:bold; 
letter-spacing:1.5px; 
text-align:left; 
padding:3px; 
margin-right: 0;
border:0;
background-color:#FFDEEE;
}
.comment_wrapper{ 
border: 0px; 
border-bottom: 7px solid #FFD6F9; 
background-color: transparent; 
padding:5px 5px 25px 5px; 
}
.comment_info { 
width:95%; 
}
.comment_links { 
text-align:right; 
padding:3px; 
margin:0px; 
border:0;
border-top: 2px solid #FFDEEE;
}
.comment_links a { 
padding:2px; 
text-decoration:none; 
}
.comment_child { 
margin: 0px 0px 0px 20px; 
}
.comment_child .entrytext {
width:auto;
}
.minicomment {
padding: 4px; 
border: 1px solid #F689C2; 
}
.minicommentholder { 
border: 1px solid #F689C2; 
}
div .systemmessage a {
text-decoration:none;
}

Layout Comments

Showing latest 10 of 20 comments

Sorry wrong window LOL, but I love this theme too, especially since it works with s2

By alienfxfiend on Aug 17, 2010 2:28 pm

I'd greatly appreciate it if someone could fix the misalignment in the main content block, I've temporarily switched to this theme and it is viewable, in the hopes that someone can fix it and therefore revive it once again, it's very beautiful indeed.

By alienfxfiend on Aug 17, 2010 2:13 pm

Love it! Totally using it :-)

By dawning09 on Aug 29, 2009 11:44 am

this works really well...but theres an add thing that may get in the way. i just uploaded this fine tho. its great. :D

By zxmbiepikachu on Jun 24, 2009 1:14 pm

I love this. Am so using it.

By piinktequila on Oct 30, 2008 9:45 am

This is so ah-mazing..
I wish you would make a myspace version :[

By BananaNugg3ts on Oct 25, 2008 6:53 pm

This one I am using on my LJ thanks for putting it together.

By TaintedReality on Oct 14, 2008 9:44 am

Thanks for using my image.

http://shinbi.devian tart.com/art/pink-21762527

-shinbi

By shinbi on Jun 17, 2008 4:12 am

i lied..i got it. =D

By nadineyvonne on Jun 13, 2008 9:34 pm

I love the layout, but all my text is to the left, and because of the ads the links are hidden.

By nadineyvonne on Jun 13, 2008 9:24 pm

View all »

Layout Details

Designer	autumn-mist
Submitted on	Feb 3, 2008
Page views	50,544
Favorites	87
Comments	20
Reviewer	S-Majere
Approved on	Feb 3, 2008

Pink City - S2 3 Column Layout

Designer's Comments

Using This Layout

Layout Code

Layout Comments

Layout Details

Layout Tags

Layout Tools

Layout Affiliates