layoutlounge | 76. Retro-ish Bubbles

Layout Style: S2 Flexible Squares
Features: Sidebar, Scrolling Tags, Double Background Images
Layout Width: 1000px

[ Preview ] [ Live ]
Credit:

layout_lounge
For help with layout please consult the How To Guides, otherwise please comment.

Layout:

/*--------------------------------
S2 Flexible Squares
Layout by http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION 
----------------------------------*/
body{
 background-color: #ededed;
 background-image: url(YOUR BACKGROUND IMAGE URL HERE);
 background-repeat: repeat;
 background-attachment: fixed;
 color: #888888;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 12px;
 margin: 0px 0 20px 0;
 }

a, a:link, a:visited { color: #DC1A4E; }
a:hover { color: #444444; }

blockquote {
 width: 70%;
 background-color: #FFFFFF;
 margin-left: 75px;
 padding: 0px 10px 10px 10px; 
 border: 3px dashed #cccccc; 
 color: #333333;
 font-size: 15px;
 line-height: 16px;
 font-family: "trebuchet ms", arial, sans-serif;
 text-align: left;
 }

img.special, i img { background-color: transparent !important; margin: 5px; 
-webkit-box-shadow: #CCC 5px 0px 5px;
-moz-box-shadow: #CCC 5px 0px 5px;
-ms-box-shadow: #CCC 5px 0px 5px;
-o-box-shadow: #CCC 5px 0px 5px;
box-shadow: #CCC 5px 0px 5px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-khtml-border-radius: 10px;
}

b, strong { color: #164032; }
i, em { color: #00604F; }
u { color: #7C0D23; }
s, strike { color: #934545; }
mark { background-color: #ECF6FF; }

.b-repost-item { display:none }

p, td{  }
 
code, kbd, pre, tt {font-family: "monospace"; }
 
ul.ljtaglist { text-align: left; padding-left: 5px; }

/*--------------General------------*/
#content {   
 background-color: #ffffff;
 background-image: url();
 background-repeat: repeat;
 width: 990px; 
 margin-left: auto; 
 margin-right: auto;  
 text-align: left;
 padding: 0px;
 border-width: 0 5px 3px 5px;
 border-style: solid;
 border-color: #ededed !important;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
-khtml-border-radius: 20px;
 }

#maincontent {
 width: 725px;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 12px;
 color: #333333;
 text-align: center;
 }

.subcontent {
 min-height: 200px;
 margin: auto;
 padding-top: 10px;
 }

/*---------------Header--------------*/
#header {  
 position: inherit;
 width: 990px;
 height: 40px;
 text-align: center;
 color: #282828;
 padding: 8px 0px 14px 0px;
 margin-top: -7px;
font-family: open sans condensed, georgia, arial;
  font-size: 14px !important; line-height: 130%;  line-height: 130%; 
 letter-spacing: 1px;
 text-transform: lowercase;
 font-weight: none;
}

div#header a, div#header a:link, div#header a:visited, div#header a:active {
 padding: 12px 15px 12px 15px;
 margin: 0px -7px 0px -7px;
 letter-spacing: 1px;
 color: #000000;
 background-color: #E8E8E8;
 text-align: left;
 border:0px solid #E0E0E0;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-khtml-transition: all 0.5s ease-out;
-moz-border-radius:0 0px 5px 5px;
-webkit-border-radius:0 0px 5px 5px;
border-radius: 0 0px 5px 5px;
-khtml-border-radius: 0 0px 5px 5px;
}

div#header li.view { 
 padding: 12px 15px 22px 15px;
 margin: 0px -7px 0px -7px;
 color: #425729;
 background-color: #D7D7D7;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-khtml-transition: all 0.5s ease-out;
-moz-border-radius:0 0px 5px 5px;
-webkit-border-radius:0 0px 5px 5px;
border-radius: 0 0px 5px 5px;
-khtml-border-radius: 0 0px 5px 5px;
 }

div#header a:hover { 
 padding: 12px 15px 32px 15px;
 margin: 0px -7px 0px -7px;
 color: #f1b000;
 background-color: #D7D7D7;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-khtml-transition: all 0.5s ease-out;
-moz-border-radius:0 0px 5px 5px;
-webkit-border-radius:0 0px 5px 5px;
border-radius: 0 0px 5px 5px;
-khtml-border-radius: 0 0px 5px 5px;
 }

ul.navheader {
 list-style: none;
 line-height: 24px;
 margin: 0;
 padding: 0;
 }

ul.navheader li  {
 display: inline;
 list-style: none;
 }
 
.title, .subtitle { display: none; }

/*--------------- footer ---------------*/

.lj-view-recent #footer, .lj-view-friends #footer {
bottom: 10px;
padding:5px 0;
position:fixed;
right:0;
text-align:left;
text-transform:lowercase;
width:100%;
z-index:0;
}

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

ul.navfooter a {
-moz-border-radius: 0 10px 10px 0;
-webkit-border-radius: 0 10px 10px 0;
border-radius: 0 10px 10px 0;
-khtml-border-radius: 0 10px 10px 0;
}

ul.navfooter li + li a {
float:right;
-moz-border-radius:10px 0 0 10px;
-webkit-border-radius:10px 0 0 10px;
border-radius: 10px 0 0 10px;
-khtml-border-radius: 10px 0 0 10px;
background-color: #272727; }

ul.navfooter li + li a:hover { background-color:#f1b000 !important; }

.lj-view-recent #footer a, .lj-view-friends #footer a, .lj-view-recent #footer a:link, .lj-view-friends #footer a:link {
background-color: #999999;
color: #ffffff;
font-family: open sans condensed, georgia,arial,sans-serif;
font-size: 13px;
padding: 10px;
}

.lj-view-recent #footer a:hover, .lj-view-friends #footer a:hover {
color:#FFFFFF;
background-color: #70736C;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
padding-right: 5px;
border-left: 4px solid #AAC6BA;
letter-spacing: 3px;
}

ul.navfooter li {
list-style:none outside none;
margin:0;
padding:0;
display:inline; }

ul.navfooter li + li {
list-style:none outside none;
margin:0;
padding:0;
display:inline;  }

#footer .viewing { display:none; }

/*--------------- sidebar ---------------*/

#sidebar {
width: 270px;
background-color: #ffffff; 
color: #999999;
font-family: open sans condensed, arial, georgia;
font-size: 12px;
font-weight: normal;
text-transform: lowercase;
float: right;
text-transform: lowercase;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
-khtml-border-radius: 20px;
 border-width: 2px 0 2px 0px;
 border-style: dotted;
 border-color: #ECE9E6;
right: 5px;
}

.sbarbody2 { 
padding: 5px; 
background-color: #F3F3F3; 
margin-top: 0px; 
margin: 0 5px 0 5px; 
line-height: 12px; 
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 11px !important; 
text-transform: lowercase; 
text-align: right;
 border: 5px solid #E0E0E0; }

.sbarbody {
margin:0;
padding: 2px;
padding-bottom: 5px; 
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
border-radius: 0 0 10px 10px;
-khtml-border-radius: 0 0 10px 10px;
}

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

li.sbaritem {
position: inline;
list-style-type: none;
margin-top: 2px;
text-align: left;
}

li.sbaritem a {
color: #33512B;
display: inline;
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 11px;
font-style: none;
font-weight: lighter;
margin-right: 0px;
padding: 2px;
text-align: left; }

li.sbaritem a:hover {
color:#444444;  }

li.sbartitle {
 list-style: none;
 color: #0E3B19; 
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; -khtml-border-radius: 10px;
text-align: center;
letter-spacing: 0px;
 font-family: "Memimas", trebuchet ms, arial, sans-serif;
 font-size: 30px;
 text-transform: normal !important;
 margin: 1px 5px 1px 5px;
text-shadow: 2px 2px 6px #bbbbbb;
 }

#sidebar_linklist  {
list-style-type:none;
padding-top:2px;
text-align: left !important;
text-transform: lowercase;}

#sidebar_linklist li.sbaritem a {
color: #DC1A4E;
display:block;
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 11px;
font-weight:lighter;
margin-right:2px;
padding:2px 5px;
text-align: left;
border-left: 3px solid #EDEDED; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px;}

#sidebar_linklist li.sbaritem a:hover {
color:#FFFFFF; 
background-color:#444444;
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px;
text-align: right;
letter-spacing: 2px; }

td.sbarcalendar {background-color:#F3F2EE;
padding: 3px;}

td.sbarcalendarposts {background-color:transparent;
padding: 3px;}

table.calendar {padding-top: 5px;}

#sidebar_summary, #sidebar_calendar, h2 { display:none!important; }

#sidebar_tags .sbarcontent { height: 300px;         overflow-x: hidden; overflow-y: auto;}

li.tagBox a { color: #33512B; display: block; font-family: trebuchet ms,arial,sans-serif; font-size: 11px; font-style: italic; font-weight: lighter; margin-right: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; padding-top: 2px; text-align: center; }

li.tagBox a:hover { color: #ffffff; background-color:#444444; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px; text-align: right;
letter-spacing: 2px; padding: 2px 5px; }

#sidebar_tags li.sbaritem a { color: #33512B; display: block; font-family: trebuchet ms,arial,sans-serif; font-size: 11px; font-style: italic; font-weight: lighter; margin-right: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; padding-top: 2px; text-align: center; }

#sidebar_tags li.sbaritem a:hover { color: #ffffff; background-color:#444444; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px; text-align: right;
letter-spacing: 2px; padding: 2px 5px; }

/*-----------Entries-----------*/
.entry {
 padding: 10px 20px 10px 20px;
 margin-bottom: 10px;
 color: #767676;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 13px;
 text-align: left;
 }
 
hr { color: transparent; height: 1px; border-bottom: 1px solid #cccccc; }

.entry ul li, ol li, li {
 padding-left: 5px;
 margin-left: 5px;
 list-style: normal;
 list-style-position: outside;
 }

.userpic {
 position: relative;
background-color: #ffffff !important;
 border: 1px solid #AFA69F;
 float: left;
padding: 10px; 
margin-left:-130px; margin-top:-11px;
 width: 100px;
 height: 100px;
 text-align: center;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 11px;
 z-index: 15;
 -webkit-border-radius: 60px;
 -moz-border-radius: 60px;
 -ms-border-radius: 60px;
 -o-border-radius: 60px;
 border-radius: 60px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;
 }

.userpic a { color: #DC1A4E !important; }
.userpic a:hover { color: #bbbbbb !important; }

.userpicfriends {
 position: relative;
background-color: #ffffff !important;
 border: 1px solid #AFA69F;
 float: left;
padding: 10px; 
margin-left:-130px; margin-top:-11px;
 width: 100px;
 height: 100px;
 text-align: center;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 11px;
 z-index: 15;
 -webkit-border-radius: 60px;
 -moz-border-radius: 60px;
 -ms-border-radius: 60px;
 -o-border-radius: 60px;
 border-radius: 60px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;
 }

.userpic img, .userpicfriends img {
 width: 100px;
 height: 100px;
 -webkit-border-radius: 50px;
 -moz-border-radius: 50px;
 -ms-border-radius: 50px;
 -o-border-radius: 50px !important;
 border-radius: 50px;
}

.userpicfriends a font {color: #DC1A4E; }
.userpicfriends a font:hover {color: #bbbbbb;  text-shadow: 2px 2px 6px #bbbbbb; }
.date  {
 margin: 0px 10px -15px 10px;
 text-align: center; 
 padding-right: auto;
 padding-left: auto;
 color: #ccccca;
 font-family: "St. Nicholas", arial, sans-serif;
 font-size: 16px;
 text-transform: normal;
-moz-border-radius: 6px 6x 0 0;
 -webkit-border-radius: 6px 6x 0 0;
 border-radius: 6px 6x 0 0;
 -khtml-border-radius: 6px 6x 0 0; }

.subject {
 padding: 0px 0px 5px 5px;
 margin: 20px 10px 0px 10px;
 color: #9C7409;
font-family: "Memimas", open sans condensed, georgia, arial;
 font-size: 32px;
 font-weight: normal; 
 text-align: left;
 text-transform: normal;
-moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 -khtml-border-radius: 4px;
text-shadow: 2px 2px 6px #bbbbbb;
word-spacing: -5px; 
 }
 
.subject a, .subject a:link, .subject a:visited {color: #9C7409;}

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

.datesubject {
 background-color: transparent;
 padding: 0px;
 text-align: left;
 }

span.ljuser a b {
 padding: 2px 0 2px 0;
 color: #DC1A4E;
 font-weight: normal;
 }

span.ljuser a:hover b {
 padding-top: 2px;
 padding-bottom: 2px;
 color: #DC1A4E;
 font-weight: normal;
 }

.skiplinks {
 text-align: center;
 margin-top: 5px;
 margin-bottom: 3px;
 font-family: "trebuchet ms", arial, sans-serif;
 padding: 10px;
 font-size: 10px;
 letter-spacing: 1px;
 color: #999999;
 background-color: #ffffff;
 }

/*-----------  Currents--------------*/

.currents, .currentlocation, .currentmood, .currentgroup, .currentmusic {
padding: 5px;
border: 0px solid #e5e5e5;
background-color: transparent !important;
margin: 5px 0 0 0;
font-size: 7pt !important;
font-family: tahoma !important;
color: #7F7F7F;
text-align: left; 
}

.currentlocation, .currentmusic {
display:none;
}

.currents strong, .currentmood strong, .currentmusic .currentlocation {
font-weight: normal;
}

/*-----Currents, tags, comment links-----*/

.ljtags {
margin-top: 20px;
text-align: left;
color: #808080;
 font-family:verdana; 
font-weight:bold; 
font-size: 8px; 
text-transform:uppercase;
}

.comments {
background-color: #f7f7f7;
color: #444444;
 font-size: 12px; line-height: 130%; 
letter-spacing:-0.1em;
padding:5px 10px;
margin-top: 8px; 
margin-left: -20px;
position:absolute;
text-align:center;
width:auto;
-moz-border-radius: 0 10px 10px 0px;
-webkit-border-radius: 0 10px 10px 0px; 
border-radius: 0 10px 10px 0px; 
-khtml-border-radius: 0 10px 10px 0px; 
}

div.comments a, div.comments a:link, div.comments a:visited {
color:#999999;
font-family: open sans condensed, arial !important;
 font-size: 14px !important; line-height: 130%; 
line-height:1;
margin:0;
padding:4px 6px;
letter-spacing: 1px; 
text-align: center; }

div.comments a:hover {
color:#ffffff;
background-color: #f1b000;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
border-left: 4px solid #425729;
letter-spacing: 3px;
-moz-border-radius: 0 10px 10px 0px;
-webkit-border-radius: 0 10px 10px 0px; 
border-radius: 0 10px 10px 0px; 
-khtml-border-radius: 0 10px 10px 0px; 
}

/*------------Comments Page--------*/
.box {
 padding: 5px 5px 5px 10px;
 margin: 0px;
 text-align: left;
 clear: left;
 background-color: #ffffff;
 }

form div.box {
 text-align: left;
 background-color: #ffffff;
  }

.reply {
 position: relative;
 font-family: "trebuchet ms", arial, sans-serif;
 margin: 20px 30px 10px 30px;
 padding: 25px 10px 10px 10px;
 text-align: left;
 font-family: "arial";
 font-size: 10px;
 line-height: 125%;
 background-color: #f1f1f1;
 color: #000000;
 }
  
.replytosubject {
 font-weight: none;
 }
  
.commentreply {
 font-family: "trebuchet ms", arial, sans-serif;
 position: relative;
 margin: 10px;
 font-size: 12px;
 font-family: "arial;
 color: #000000;
 }
  
.commentbox {
 align: left; 
 padding: 2px; 
 margin: 2px; 
 }

.userpiccomment {
 margin: -2px 5px 5px 0px;
 padding: 10px;
 width: 100px;
 height: 100px;
 float: left;
 background: #FFF!important;
 -webkit-border-radius: 60px;
 -moz-border-radius: 60px;
 -ms-border-radius: 60px;
 -o-border-radius: 60px;
 border-radius: 60px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;
}
  
.datesubjectcomment a:link, .datesubjectcomment a:visited {
 color: #666666; cursor: crosshair; text-decoration:none; font-weight:none;}
  
.datesubjectcomment a:hover {
 color: #666666; cursor: crosshair; text-decoration:none; font-weight:none;}
 
.commentboxpartial {
 border-color: #000000; 
 border-width: 0px; 
 border-style: solid; 
 padding: 10px; 
 margin: 10px; 
 background-color: transparent !important;
 }

.commentinfo {
 background-color: #f1f1f1; 
 margin-top: 5px; 
 width: 100%;
 }

/*-----------Year/Archive Page----------*/

ul.year {  text-align: center;  padding: 5px;         background-color: #ffffff; }

ul.year li {display: inline;}

table.yeartable { margin-left: auto; margin-right: auto; padding: 10px 100px 10px 100px; background-color: #ffffff; }

table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px solid #cccccc; color: #888888; }

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

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

/*-----------Tags Page---------*/

ul.ljtaglist {
 color: #888888;
 font-family: "trebuchet ms", arial, sans-serif;
 font-size: 13px;
 padding: 8px 8px 8px 20px;
 background-color: #ffffff;
 }

ul.ljtaglist li  {list-style: normal;}

/*----------SECTION: Tiny Icons----------*/
.currentlocation {
 background: url(http://i54.tinypic.com/msm1c0.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentmood  {
 background: url(http://i32.tinypic.com/2vhsnxy.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentmusic {
 background: url(http://i26.tinypic.com/2nv6qtf.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentgroups {
 background: url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/foaf.png) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

/* PROTECTED ENTRY */
.subject img[src*="icon_protected.gif"]{
 width: 0;
 height: 0;
 padding: 16px 0px 0 16px;
 background: URL(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/lock-unlock.png) no-repeat !important; 
 }

/* FRIENDS GROUP */
.subject img[src*="icon_groups.gif"]{
width: 0; height: 0; padding: 0 16px 16px 0; background: url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/foaf.png) no-repeat !important; }

/* PRIVATE ENTRY */
.subject img[src*="icon_private.gif"]{
 width: 0;
 height: 0;
 padding: 16px 0px 0 16px;
 background: URL(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/lock.png) no-repeat !important; 
 }

/* USER */
html body .ljuser img {
 width: 0 !important;
 height: 0 !important;
 background-repeat: no-repeat;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/owl.png) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

html body .ljuser img[src*="userinfo.gif"] {
 width: 0 !important;
 height: 0 !important;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/owl.png) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

/* COMMUNITY */
html body .ljuser img[src*="community.gif"] {
 width: 0 !important;
 height: 0 !important;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tiny_icon_tree_apples.png) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

/*-----------Mics-----------*/
.clear { height: 0px; font-size: 0.01px; }
 
#lj_controlstrip_statustext {
 color: #999999;
 font-size: 12px;
 font-weight: bold;
 }

#lj_controlstrip td {
 font-family: "georgia" !important;
 font-size: 12px;
 background-color: #000000 !important;
 border: 0px solid #999999;
 }

#lj_controlstrip a, #lj_controlstrip a:visited {
 font-family: "georgia" !important;
 font-size: 11px;
 color: #999999 !important;
 text-transform: lowercase;
 }

#lj_controlstrip a:hover { color: #6DA9C1 !important; }

.headerimage {
 position: relative;
 width: 800px;
 height: 100px;
 margin-left: auto;
 margin-right: auto;
 margin-top: 0px;
 padding: 5px;
 background-color: transparent !important;
 background-image: url(YOUR HEADER IMAGE URL HERE);
 background-repeat: no-repeat;
-moz-border-radius: 0 0px 20px 20px;
-webkit-border-radius: 0 0px 20px 20px;
border-radius: 0 0px 20px 20px;
-khtml-border-radius: 0 0px 20px 20px;
 }

.separator { height: 20px; }

#content_14, #banneradrow { display:none!important; }
#content_14 { display:none!important; }
.banner_ad_fix { display:none!important; }

Click here for fonts and font tutorial:
Memimas & St. Nicholas

Background Image:

Headers:

graffitigraphic
More Background Images: Layout Lounge Site
More Tiny Icons: Layout Lounge Site

RULES:
No Hotlinking Images #4 under general
Header can be changed
Background image can be changed or removed.
Credit Necessary.

Threaded | Top-Level Comments Only

From:

auroradream.livejournal.com

I like these bubble style layouts! Do you ever do any layouts for Dreamwidth?

sireesanwar.livejournal.com

Not really but these should be able to convert. I currently have a LJ layout on my DW journal but I don't know how I did it.

I would try using this layout over there in the Custom CSS and see if it prompts you or something.

I think I shall! I'll report back with findings. :)

I found this on DW
http://starlit.dreamwidth.org/272.html

I got everything all together and it looks lovely! The only issue is that when I added the header image I wanted it is cut off.

http://auroradream.dreamwidth.org/

Any thoughts?

tracyj23.livejournal.com

This is lovely! I was wanting a change at my journal and this is it. The problem is, I pasted in the coding but don't know where to find the coding for the background image. I'm not getting it to come up right and I think the problem is the (your background image url here) - I have nothing to put there. Help!

Okay, I've got the background figured out. (No easy feat for tech challenged people like me!) but now the rest isn't coming up the way it should. It's still coming up flexible squares like I had it before. I don't have any more time to mess with it today but I'm hoping you can check it out next week and help me get it so it looks like your preview here. Have a good weekend!

Edited Date: 2013-04-06 03:14 pm (UTC)

I'm on my phone till Monday. I'll check our out then. I'm sure we can fix it.

No problem. I'll fix it up on Monday.

Thank you!

Okay. Big oops. Go to the end of the coding. You'll see the Header Image coding. Make the width and height the same as your header image and it should come up perfectly.

What image do you want as your header image?

I don't know. Something with flowers? Surprise me. :)

Done. Let me know if you have trouble with the userpics on your Friends page....

Also, the fonts. You probably aren't seeing the same fonts for the Subject.

You'll want to go to
http://layout-lounge.livejournal.com/20117.html

Memimas is the font for the subject. There is a tutorial at the bottom of the page for adding it to your computer.

Thank you! I'm finding that I need to widen the screen in order to see the userpics on my friends page and I'd prefer not to have it quite that wide. Is there a way to fix that?

I hadn't even thought about the fonts. I'll take a look. Thanks.

I can move them but the question is do you want them on the left or the right. Either way it will margin around it.

I'm used to them being on the right, if you don't mind moving them.

No problem. Just wanted to check in to be sure.

I've a question for you. I just went to post something - friends only - and discovered that the "protected post" symbol is actually a lock that is opening, which would seem to show it's unlocked. My journal is private and I don't want any posts public and this confuses me. Your custom friends group symbol is a little group of bubbles, which is what it was with the last layout I used from you, but for locked posts.

Is there a way you could change it so the locked posts actually have a locked symbol rather than an unlocked one?

Cool. Okay so the userpics are done.

I changed the lock to a locked lock. Special Friends Groups will be little happy faces and private is an eye. There will be no image if it is a public post.

Do you want anything on your sidebar?

Thank you! That makes so much more sense to me. Evidently I confuse easily. :)

Let me think on the sidebar and let you know.

No problem.

Enjoy.

brysenia.livejournal.com

This is gorgeous <3 Memming for future use.
Thank you for sharing.

You are very welcome. I intend to keep thing journal around as long a humanly possible so it will be here.

I'm really glad to know that :D
And your graphic works are ALL amazing <3

Thanks x2. ;-)

22luna22.livejournal.com

Love the Bubbles. I use it. Thank you .
I love your Layouts.
Hope I do it the right way.

Thank you.

If you need help just comment again.

Hi ^^ I've just noticed that, with your layouts, putting the ads vertical you hide the ads *_*

Again, thank you so much for sharing your codes. Love you <3

Hmm... that seems unintentional but not wholly unwelcome.

*bows* You are welcome!

ellettra.livejournal.com

This isn't working for me, no matter what I've tried. The background isn't displaying, and your layout doesn't appear to have a header image - I don't really need one either. Any idea what might be wrong?

I'm not sure why the background isn't displaying... I'd have to see this in action.

There is coding for the headerimage towards the bottom of the coding.

Layout Lounge

Layouts, Tutorials, Help, and more

76. Retro-ish Bubbles

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

About

Links

Tags

Summary

April 2025