Could someone take a look at my layout coding and tell me how to move my entry userpics up the page slightly. Probably only about 10px?
Also, any advice on how to counter the delay in loading my page background? It's annoying. But I've no idea what to do about it.
My skills are limited, so if you could bear that in mind when offering help I'd be grateful.
Thanks in advance.
/* Template: (#25) Your Biggest Flan v. Regular Width */
/* Date: March 4, 2007 */
/* S2 Style: Mixit */
/* Available at
http://community.livejournal.com/thefulcrum/ */
/* Made by Liz a.k.a. grrliz.livejournal.com */
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC BELOW --------------- */
/* -------------------------------------------------------- */
#header {position: relative; height: 374px; background: url(
http://pics.livejournal.com/ruby_chalice/pic/0002y60c) top center no-repeat;}
/*
- make sure that your height is the height of your graphic plus 40px
- e.g. if your graphic is 350px, your height should be 390px
*/
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC ABOVE --------------- */
/* -------------------------------------------------------- */
html {margin: 0px; padding: 0px; font-size: 100%; /* IE hack */ }
body {
margin: 0px;
padding: 0px;
background-image: url(
http://pics.livejournal.com/ruby_chalice/pic/0002k00b); background-repeat: repeat;
color: #867660;
font-family: "century gothic", tahoma, verdana, arial, sans-serif;
font-size: 56.75%;
text-align: center;
}
a, a:link, a:visited, a:active {color: #DB9C7B; text-decoration: none;}
a:hover {color: #E0A8A1; text-decoration: underline;}
p {margin-top: 0.8em; margin-bottom: 0.8em;}
blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px dashed #bbbbbb; background: #FEF8EC;}
input, textarea, select {}
/* ----------------------------------------- */
/* ---------- PAGE STRUCTURE --------------- */
/* ----------------------------------------- */
/* -- don't touch the stuff below -- */
#page, #header, #content, #footer {position: relative; top: 0;}
#alpha, #beta, #gamma {display: inline; float: left; position: relative; top: 0;}
#footer {margin: -1px 0 0 0; /* HACK - removes space between content and footer */}
#page-inner, #header-inner, #content-inner, #alpha-inner, #beta-inner, #gamma-inner, #footer-inner {position: static;}
#header-inner, #alpha-inner, #beta-inner, #gamma-inner {overflow: hidden; /* hide content that is larger than the element dimensions */}
#alpha-inner[id] { overflow: visible; } /* FF MAC & PC will clip pager-top when accessing page anchor */
/* -- don't touch the stuff above -- */
#container {position: relative; margin: 0px auto; font-size: 1.2em; line-height: 1.8em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}
#page {width: 760px; margin: 0px auto; padding: 0px; border: 1px solid #F3E1C5; background: #F3E1C5;}
#header-inner {margin: 0px auto;}
#content {text-align: left;}
#alpha {width: 560px;}
.layout-tw #alpha {float: right;}
#alpha-inner {margin: 0 20px;}
#beta {width: 200px;}
.layout-wt #beta-inner {padding: 1.8em 20px 20px 0px}
.layout-tw #beta-inner {padding: 1.8em 0px 20px 20px}
.lj-view-archive #alpha-inner,
.lj-view-month #alpha-inner,
.lj-view-tags #alpha-inner {padding-top: 20px; padding-bottom: 20px;}
/* ---------------------------- */
/* ---------- HEADER ---------- */
/* ---------------------------- */
#header-content {overflow: hidden; text-transform: uppercase; text-align: center;}
#header-text ul.nav {position: absolute; bottom: 0px; left: 0px; width: 100%; height: 40px; line-height: 40px; margin: 0px; padding: 0px; border-top: 1px dashed #D1BB6D; border-bottom: 1px dashed #D1BB6D; background: #EFE6D4; text-transform: lowercase; }
#header-text ul.nav li {margin: 0px; padding: 0 0.9em; display: inline;}
#header-text ul.nav li.item {border: 0px;}
#header-text ul.nav a {color: #DB9C7B; font-size: 1.25em; text-decoration: none;}
#header-text ul.nav a:hover {color: #E0A8A1;}
#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: #DB9C7B; text-decoration: none;}
#header-name a:hover {color: #DB9C7B;}
#header-description {display: none; margin: 0px auto; }
/* ----------------------------- */
/* ---------- ENTRIES ---------- */
/* ----------------------------- */
/* previous and next links */
.stream-header {display: none; padding: 10px 20px; text-align: center;}
.stream-footer {padding: 0px; text-align: center;}
/* entry container */
.asset {margin: 0px; padding: 0px 0px 13px 0px; border-bottom: 1px dashed #867660;}
.asset-inner {padding: 0 0 1.8em 0; }
.asset-header {padding: 1.8em 0 0.9em 0;}
.lj-view-entry .asset-header {padding: 0; }
/* entry subject */
h2.page-header2 {margin: 0px; padding: 0.2em 0; font-size: 1.25em; font-weight: normal;}
h2.page-header2 a, .lj-view-tags h2 {color: # DB9C7B; text-decoration: none;}
h2.page-header2 a:hover {color: #E0A8A1;}
abbr.datetime {
margin: 0px; padding: 0px;
list-style-type: none;
color: #867660;
font-size: 1em;
text-transform: uppercase;
text-align: right;
}
/* entry body, meta, tags */
.asset-content {margin-bottom: 0.9em; padding-bottom: 0.9em; }
/* entry text */
.asset-body {padding: 0.9em 0;}
.asset-body a {color: #DB9C7B; font-weight: bold; border-bottom: text-decoration: none;}
.asset-body a:hover {color: #E0A8A1;}
.asset-body dt {border-bottom: 1px dashed #bbbbbb; font-weight: bold;}
.asset-body dd {margin-left: 3.6em; padding: 10px; background: #FEF8EC; border: 1px dashed #bbbbbb; border-top: 0px; }
/* date and time */
div.asset-header ul {margin: 0px !important; padding: 0px !important;}
div.asset-header li.item {padding: 0px;}
.ljuser {display: inline !important;}
/* userpic */
.user-icon {float: right; margin-left: 5px; padding: 1px; background: transparent !important; text-align: center;}
.user-icon span {background: #ffffff !important; text-align: center;}
/* mood, music, location */
.lj-currents ul {margin: 0px; padding: 0px;}
.lj-currents ul li {list-style: none;}
.lj-currents img {display: none;}
.entryMetadata-label {font-weight:bold;}
.entryMetadata-content {margin-left: 2px;}
/* --- tags --- */
.asset-tags-header {
display: block; float: left;
width: 3.5em; /* matches .asset-tags-content width */
height: 100% !important;
margin: 0px; padding: 0px;
font-size: 1em !important;
}
.asset-tags-list {margin: 0 0 0 3.5em; padding: 0px; list-style-type: none;}
.asset-tags-list li {display: inline; padding-right: 5px;}
.asset-tags-list a {white-space: normal !important;}
/* comments bar */
ul.asset-meta-list {clear: both; margin: 0px; padding: 0px; list-style-type: none;}
li.asset-meta-comments {display: inline; margin: 0px 10px 0px 0px;}
ul.asset-meta-list .item {border: 0px;}
.prevnext, .prev, .next {padding: 5px 0px;}
/* ----------------------------- */
/* ---------- SIDEBAR ---------- */
/* ----------------------------- */
.widget {margin-bottom: 20px;}
.widget-inner {}
.widget-header {margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; color: #867660; border-bottom: 1px dashed #867660; font-size: 1.3em; text-transform: uppercase;}
.widget-content {margin: 0px; padding: 0px;}
.widget ul {margin: 0px; padding: 0px 0px 0px 20px;}
.widget a {color: #DB9C7B;}
.widget a:hover {color: #E0A8A1; text-decoration: none;}
/* profile */
.about-me-widget {display: none; text-align: center;}
.about-me-widget .widget-header a {color: #333333;}
.about-me-widget .widget-header a:hover {color: #bbbbbb;}
.about-me-widget dl, .about-me-widget dd, .about-me-widget dt {margin: 0px; padding: 0px; width: 100%;}
/* calendar */
.calendar-widget {}
.calendar-widget table {width: 100%; text-align: center;}
.calendar-widget p {margin: 5px 0px; padding: 0px; text-align: center;}
.calendar-widget tr:first-child a {background: #FEF8EC; border: 0px;}
.calendar-widget td a {display: block; width: 100%; color: #DB9C7B; background: #FEF8EC; border: 1px solid #867660;}
/* link list */
.typelist-widget li.item {margin: 0px; padding: 0px; }
/* tags */
.categories-widget .widget-footer {padding: 20px 0px 0px 0px;}
.categories-widget li.item {margin: 0px; padding: 0px;}
.categories-widget li.tag {display: inline; padding: 0px 1px; background: none; }
/* post summary */
.archive-widget li.item {margin: 0px 0px 5px 0px; padding: 0px;}
.links-widget .widget-list .item {
margin-bottom: .2em;
border: none !important;
}
.widget-list .tagcloud {
list-style: none !important;
display: inline !important;
color: #ff0000 !important;
white-space: nowrap !important;
border-left: 0 !important;
width: 100% !important;
}
/* syndication, LiveJournal link, designer link */
.syndicate-widget,
.powered-widget,
.designed-widget {display: none;}
/* ----------------------------------- */
/* ---------- COMMENTS PAGE ---------- */
/* ----------------------------------- */
/* Comments ---------------------------------------*/
#comments {padding: 0px;}
div.comments-inner h2 {margin: 0px; padding: 1.5em 0 0 0; color: #20a7c9; font-size: 2em; font-weight: normal;}
.comment {margin-bottom: 1.8em; padding: 0.9em 0; border-bottom: 1px dashed #bbbbbb;}
.comment-odd {}
.comment-even {background: #ffffff;}
.comments-nav {margin: 20px; text-align:center;}
/* --- reply, freeze, screen, etc --- */
.comment-links {margin-top: 0.9em; font-weight: normal; text-align: right; font-size: 1em;}
.comment-subject {font-weight: bold; }
.comment-date {margin-top: 0.9em; margin-bottom: 0.9em;}
/* Fix height in IE */
.comment {height: 1%;}
/* Quick Reply ---------------------------------------*/
.quickreply {margin-top: 1em; width:90%; padding-top: 5px; padding-bottom: 10px;}
#commenttext, #subject {width: 90%;}
#comment-form {width: 500px;}
/* ------------------------------ */
/* ---------- ARCHIVES ---------- */
/* ------------------------------ */
/* Calendar/Archive ---------------------------------------------------------------------- */
ul.year {text-align: center; padding: 0px;}
ul.year li {display: inline; padding: 0px 5px;}
table.yeartable {margin-left: auto; margin-right: auto;}
table.yeartable td.yeardate, table.yeartable td.yearday {border: 1px solid #867660;}
table.yeartable td.yearday {background-color: #FEF8EC; text-align: center;}
td.yearmonth {border-style: none; font-weight: bold;}
dd.viewsubjects {margin: 0 0 .75em .75em;}
.lj-view-month table {}
.lj-view-month widget table {margin: 0px !important;}
/* -------------------------- */
/* ---------- MISC ---------- */
/* -------------------------- */
/* Sponsored Plus ---------------------------------------*/
#ad-5linkunit {
clear: both;
}
#ad-leaderboard {
margin-bottom: 10px;
}
textarea, input, select, radio, #talkpostfromremote, #SearchType {border:1px solid #867660;color:#867660;background:#F3E1C5;scrollbar-arrow-color:#867660;scrollbar-base-color:#F3E1C5;scrollbar-darkshadow-color:#F3E1C5;scrollbar-face-color:#F3E1C5;scrollbar-highlight-color:#867660;scrollbar-shadow-color:#F3E1C5;scrollbar-track-color:#F3E1C5;margin-bottom:3px;}
/* Utility Code --------------------------------------------------- */
/* clear floats, inspired by positioniseverything.net/easyclearing.html */
.comment-body:after,
#page-inner:after,
#header-inner:after,
#header-photo:after,
#content-inner:after,
#alpha-inner:after,
#beta-inner:after,
#gamma-inner:after,
#delta-inner:after,
#footer-inner:after,
.widget .user-pic:after {
content: ".";
display: block;
visibility: hidden;
clear: both;
height: 0.1px;
font-size: 0.1em;
line-height: 0.1px;
}
/* float in post bodies around enclosures */
#content-inner,
.asset-body {
height: 1%;
}
/* Win IE < 7 */
* html #header-name a { word-wrap: break-word; }
/* ----------------------------------------------------------------------- */
/* ---------- PLEASE PASTE ANY FURTHER CSS OVERRIDES BELOW HERE ---------- */
/* ----------------------------------------------------------------------- */