Layout 017 : High Tide
Click for a Live Preview.
( Layout ) #017 : High Tide
Akira and Aika from ARIA!
( Install ) Step 1 - System
Select Theme
- Select any S2 Smooth Sailing layout.
Page Setup
- Ad Placement: Horizontal
(Ignore if you have a paid account.)
- Sidebar: 2 Column (sidebar on right)
← Previous Step | 1 | 2 | 3 | 4 | Next Step →
( Install ) Step 2 - Display
Customize Display
- Userinfo Position in Entries: Right
- Wrap Entry text under userinfo: Yes
- Userinfo Position in Comments: Right
← Previous Step | 1 | 2 | 3 | 4 | Next Step →
( Install ) Step 3 - Stylesheet
Custom CSS
- Use layout's stylesheets: No. IMPORTANT!!
- Custom Stylesheet: /* S2 SMOOTH SAILING --- High Tide ---
Wingweaver22 @ Fruitstyle.livejournal.com
Do not remove this note. */
/* ------------------------------ PAGE ------------------------------ */
body { background-image: url(http://i38.tinypic.com/28p15z.jpg); background-position: bottom left; background-repeat: no-repeat;
font-family: trebuchet ms; color: #28658b; font-size: 11px; margin: 0px; padding: 0; background-color: #e0f9fc; background-attachment: fixed;}
a, a:visited{ color: #6bcce3; padding: 0px; text-decoration: none;}
a:hover { color: #ffffff; background-color: #6bcce3; cursor: help; border: 0;}
blockquote{ background-color: #e0f9fc; margin: 5px; padding: 5px;}
input, textarea, select { border: 1px solid #6bcce3; font-size: 10px; color: #28658b; background-color: #ffffff;}
select{ width: 90px; } .sidebar input{ margin: 10px 0 10px 0;}
.pageblock{ width: 600px; padding: 0; margin: 0 auto; }
.pagefooterblock{display: none;}
/* ------------------------------ HEADER ------------------------------ */
.header-title, .header-subtitle, .header-icon {display: none;}
.pageheaderblock { text-align: center; margin: 50px 0 50px 0; height: 250px; padding: 10px; background-color: #fefefe;
background-image: url(http://i33.tinypic.com/ip5g74.jpg); background-position: center; background-repeat: no-repeat;
border: 90px solid #6bcce3;}
.header-menu { display: none;}
.header-menu a, .header-menu a:visited { margin: 0 6px 0 6px; padding: 0;}
.header-menu a:hover {}
.header-menu ul, #footer-menu ul {margin: 0px; padding: 0px;}
.header-menu li, #footer-menu li {display: inline; margin: 0px; padding: 0px;}
/* ------------------------------ BODY ------------------------------ */
.bodyblock { padding: 0; margin: 0; }
.bodyheaderblock, body-title, body-midtitle {display: none;}
.bodynavblock {text-align: left;}
/* ------------------------------ SIDEBAR ------------------------------ */
.sidebar { margin: 0 0 0 10px; }
.sidebox{ width: 100px; }
.sideboxTitle { display: none;} .sideboxContent {}
.sidebox #freetext {} .sidebox #profile, .sidebox #latestmonth, .sidebox #search, { }
.latestmonth-inactive { font-size: 9px; padding: 1px; } .latestmonth-active { font-size: 9px; padding: 1px; }
#tags_sidebox a { display: block; font-size: 9px; }
#tags_sidebox { font-size: 0; }
/* ------------------------------ ENTRIES ------------------------------ */
.entryHolder {margin-bottom: 50px; width: 600px; }
.entryHolder a { padding: 0 5px 0 5px; }
.entryUserinfo { margin-right: -200px; margin-top: 10px; }
.entryUserinfo-usericon img { border: 10px solid #6bcce3; padding: 5px; background-color: #ffffff; display: none; }
.entryText {background-color: #ffffff; margin: 0px; padding: 20px; }
.entryHeader { text-align: center; border-right: 100px solid #6bcce3; border-left: 100px solid #6bcce3; }
.entryHeaderSubject { text-transform: uppercase; font-size: 12px; letter-spacing: 5px; }
.entryHeaderDate{ font-size: 9px; color: #6bcce3}
.entryLinkbar { text-align: center;}
.entryLinkbar ul { margin: 0; padding: 10px; }
.entryLinkbar li { display: inline;}
/* ------------------------------ META ------------------------------ */
.entryMetadata { display: none; }
.entryMetadata img { padding: 5px; }
.entryMetadata ul { margin: 0; padding: 1px; }
.entryMetadata li { list-style: none; display: block; padding: 2px 0 0 0;}
.entryMetadata a { padding: 0 4px 0 4px; }
.entryMetadata-label {}
/* ------------------------------ FOOTER ------------------------------ */
#footer-menu { text-align: center; }
#footer-menu a { padding: 0 10px 0 10px; }
/* ------------------------------ COMMENT PAGE ------------------------------ */
.commentHolder {}
.commentUserinfo {}
.commentUserinfo-usericon img {display: none; }
.commentText { background-color: #ffffff; padding: 10px; margin: 10px;}
.commentHeader { padding: 5px; }
.commentHeaderScreened { background-color: #6bcce3; color: #ffffff; padding: 5px; }
.commentHeaderSubject {}
.commentLinkbar {}
.commentLinkbar a { padding: 0 5px 0 5px; }
.commentLinkbar ul {} .commentLinkbar li { display: inline; }
.replyform { border: 0; background-color: #ffffff;}
#commenttext{ width: 100%; }
#qrform table {border: 0 !important; background-color: #ffffff; padding: 10px;}
/* ------------------------------ ARCHIVE PAGE ------------------------------ */
.yearlinks { text-align: right; }
.yearlink{ padding-left:4px; padding-right: 4px; }
.month { width: 600px; padding: 10px; margin: 0; background-color: #ffffff;}
.daytitles { text-align: ; background: #6bcce3; padding: 2px; color: #ffffff; }
.day-blank { padding: 2px; }
.day { padding: 2px; }
.day-count { width: 50%; text-align: left; float: right; }
/* ------------------------------ TAGS PAGE ------------------------------ */
/* tags container */
.tagstable td { padding-top: 5px 0px 5px 0px; }
.tagstable { text-transform: lowercase; letter-spacing: 1px; width: 400px; }
/* ------------------------------ EXTRAS ------------------------------ */
::-moz-selection { background: #28658b; color: #ffffff; }
::selection { background: #28658b; color: #ffffff; }
code::-moz-selection { background: #28658b; color: #ffffff; }
code::selection { background: #28658b; color: #ffffff; }
div.ContextualPopup { margin: 10px 0 0 0px; font: normal 10px "trebuchet ms" !important;}
div.ContextualPopup img {margin: 0 !important; padding: 0 !important;}
div.ContextualPopup .Userpic {border: 5px solid #6bcce3; padding: 0 !important;}
div.ContextualPopup div.Inner { background-color: transparent!important;
color: #ffffff !important; border: 1px solid #ffffff; padding: 0;
width: 250px;text-align: right;}
div.ContextualPopup .Content {padding: 3px 10px 3px 10px; background-color: #6bcce3; margin-right: 70px;}
div.ContextualPopup .Relation {font-weight: normal !important; letter-spacing: 3px;}
div.ContextualPopup .Content .OnlineStatus {font-weight: normal;}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important; font-weight: normal; color: #ffffff !important;}
.ljuser img{ display: none;}
#lj_controlstrip, #lj_controlstrip td {background-color: #6bcce3; border: 0; }
#lj_controlstrip input, #lj_controlstrip textarea, #lj_controlstrip select { border: 1px solid #6bcce3; font-size: 10px; color: #28658b; background-color: #ffffff;}
#lj_controlstrip select{ width: 90px; }
;){kind=link}
;){kind=link}
← Previous Step | 1 | 2 | 3 | 4 | Next Step →
( Install ) Step 4 - Link Back
Please link back to fruitstyle so others can find my layouts. Put either a button or the code in your Userinfo.
ButtonCode
View available buttonsLayout by fruitstyle
← Previous Step | 1 | 2 | 3 | 4 | Next Step →
( Optional ) Add a Banner
The recommended banner size is 400px wide and 250px high.
Replace the image in the CSS.
Add a Banner | Replace Colours | Replace Images
( Optional ) Replace Colours
#ffffff#e0f9fc#6bcce3#28658b
How do I replace layout colours?
Add a Banner | Replace Colours | Replace Images
( Optional ) Replace Images
Get all the images at Box.net
How do I replace layout images?
The textures used in this layout are by mozart.
Add a Banner | Replace Colours | Replace Images
Fruitstyle: Layouts and Winamp Skin Designs by Malionette
