[SOLVED] Spacing before metadata

May 21, 2010 15:28

I just changed my layout to one that is Mixit-based, and the CSS template I entered for the layout can be found here. I managed to fix some issues, but this one is still bugging me.

/* Template: (#58) P.S. I Love You */
/* Date: March 1, 2009 */
/* S2 Style: Mixit */
/* Available at http://community.livejournal.com/thefulcrum/ */
/* Made by Liz a.k.a. grrliz.livejournal.com */

* {margin: 0px; padding: 0px; }

html {font-size: 100%; /* IE hack */ }

body {padding: 0px 0px 30px 0px;
background: #333333;
color: #eeeeee;
font-family: "palatino linotype", palatino, georgia, times new roman, serif;
font-size: 62.5%;
text-align: center;
}

a, a:link, a:visited, a:active {color: #DF1F55; font-weight: normal; text-decoration: none; outline: none;}
a:hover {color: #DF1F55;}

blockquote {margin: 1em 2em; padding: 1em; border-top: 3px dotted #cccccc; border-bottom: 3px dotted #cccccc; background: #f3f3f3;}

input, textarea, select {}

h1, h2, h3 {margin: 5px 0px;}

font {font-family: inherit !important; color: inherit !important;}

/* ----------------------------------------- */
/* ---------- 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; width: 960px; margin: 0px auto; font-size: 1.1em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}

#page {margin: 0px auto; padding: 0px;}

#header {position: relative; background: url(http://i6.photobucket.com/albums/y208/KyrieEleison/LJ%20layout%20pieces/58_header.gif) top center no-repeat transparent; color: #333333;}
#header-inner {position: relative; height: 180px; padding: 0px 50px; background: url(http://i6.photobucket.com/albums/y208/KyrieEleison/LJ%20layout%20pieces/58_ribbon.gif) bottom center no-repeat transparent;}

#content {padding-top: 17px; background: url(http://i6.photobucket.com/albums/y208/KyrieEleison/LJ%20layout%20pieces/58_bg.gif) top center repeat-y #ffffff; color: #333333; text-align: left;}
#content-inner {padding-bottom: 55px; background: url(http://i6.photobucket.com/albums/y208/KyrieEleison/LJ%20layout%20pieces/58_ribbon.gif) bottom center no-repeat transparent;}

#alpha {display: inline; width: 645px;}
.layout-tw #alpha {float: right;}
.layout-wt #alpha {float: left;}
.layout-tw #alpha-inner {margin-right: 65px;}
.layout-wt #alpha-inner {margin-left: 65px;}
#alpha-inner {}

#beta {display: inline; width: 300px;}
.layout-tw #beta {float: left;}
.layout-wt #beta {float: right;}
.layout-tw #beta-inner {margin-left: 65px;}
.layout-wt #beta-inner {margin-right: 65px;}
#beta-inner {position: relative;}

/* ---------------------------- */
/* ---------- HEADER ---------- */
/* ---------------------------- */

#header-content {overflow: hidden; text-align: center; text-transform: uppercase;}

#header-text {font-weight: bold; text-transform: lowercase;}
#header-text ul.nav {padding-top: 150px; width: 100%; font-size: 16px; text-align: lcenter;}
#header-text ul.nav li {display: inline; padding: 0px 10px; }
#header-text ul.nav li a {color: #ffffff;}
#header-text ul.nav li a:hover {}
#header-text ul.nav li.current a {}

#header-name {position: absolute; top: 75px; left: 0px; width: 100%; color: #DF1F55; font-size: 2.2em; text-align: center; text-transform: lowercase;}
#header-name a {}

#header-description {display: block; position: absolute; bottom: 60px; left: 0px; width: 100%; font-weight: normal; text-transform: uppercase; letter-spacing: 1px;}

/* ----------------------------- */
/* ---------- ENTRIES ---------- */
/* ----------------------------- */

/* previous and next links */
.stream-header, .stream-footer {clear: both; display: block; padding: 2px; border: 1px solid #dddddd; background: #efefef; text-transform: uppercase; text-align: center;}
.stream-header {display: none; margin-bottom: 1em;}
.stream-header a, .stream-footer a {color: #333333;}
.stream-header a:hover, .stream-footer a:hover {text-decoration: underline;}

p.prevnext {padding: 10px; border: 1px solid #dddddd; background: #fafafa; }

/* entry container */
.asset {position: relative; clear: both; margin-bottom: 1em; padding: 2px; border: 1px solid #dddddd; background: #efefef; font-size: 1.1em; text-align: justify;}
.asset a img {border: 1px solid #DF1F55;}
.asset a:hover img {border: 1px solid #DF1F55;}

.asset-header {}
.asset-header ul.asset-meta-list {border: 0px;}
.asset-header img {max-height: 11px;}
.lj-view-entry .asset-header {padding: 0; }

/* entry subject */
h2.page-header2 {margin: 0px 0px 2px 0px; padding: 10px; border: 1px solid #dddddd; background: #fafafa; font-size: 1.8em; font-weight: bold; text-align: left;}
h2.page-header2 a, .lj-view-tags h2 {text-decoration: none;}

.lj-view-entry h2.page-header2 {padding: 5px 10px;}

/* entry body, meta, tags */
.asset-content {margin: 2px 0px; padding: 10px; border: 1px solid #dddddd; background: #fafafa;}

/* entry text */
.asset-body {line-height: 1.5em; overflow-x: hidden;}
.asset-body a {border-bottom: 1px dotted #999999; font-weight: bold;}
.asset-body a:hover {border-bottom: 1px dotted #DF1F55;}
.asset-body ol, .asset-body ul {margin: 10px 40px;}
.asset-body dt {padding: 5px 0px; border-bottom: 3px double #dddddd; font-weight: bold; text-transform: uppercase;}
.asset-body dd {margin-left: 30px; padding: 10px; border: 1px solid #dddddd; border-top: 0px;}
.lj-view-month .asset-body dt, .lj-view-month .asset-body dd {margin: 0px; padding: 0px; border: 0px;}
.lj-view-month .asset-body dt a {color: #333333; text-decoration: none;}
.lj-view-month .asset-body dd span.ljuser a {color: #333333; text-decoration: none;}

.ljuser {display: inline !important;}
.ljuser a {background: transparent; color: #DF1F55; border: 0px;}

/* userpic */
.user-icon {float: right;}
.user-icon img {margin: 0px 0px 5px 10px; border: 2px solid #DF1F55;}

/* comments bar */
ul.asset-meta-list {padding: 10px; border: 1px solid #dddddd; background: #fafafa; text-transform: lowercase; text-align: left;}
ul.asset-meta-list .item {display: inline; border: 0px;}
li.asset-meta-comments {padding-right: 10px;}
li.asset-meta-comments a {}
li.asset-meta-comments a:hover {}

.prevnext, .prev, .next {padding: 5px 0px;}

/* date and time */
div.asset-header ul {top: 0px; margin: 0px!important; padding: 0px !important; font-size: 11px; text-transform: uppercase; list-style-type: none;}
div.asset-header ul.asset-meta-list .item {display: block; padding: 5px 10px; border: 1px solid #dddddd; background: #fafafa; text-align: right;}

/* ----------------------------- */
/* ---------- SIDEBAR ---------- */
/* ----------------------------- */

.widget {margin-bottom: 1em; padding: 2px; border: 1px solid #dddddd; background: #efefef; font-size: 1.1em;}

.widget-header {margin: 0px 0px 2px 0px; padding: 10px; border: 1px solid #dddddd; background: #fafafa; text-align: center; text-transform: uppercase; letter-spacing: 1px;}
.widget-header a {color: #333333;}

.widget-content {padding: 10px; border: 1px solid #dddddd; background: #fafafa;}
.widget-footer {}

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

/* profile */
.about-me-widget {}
/* to turn the profile module on, simply delete the line above */
.about-me-widget .widget-header a {font-weight: bold;}
.about-me-widget .widget-content {position: relative;}
.about-me-widget dl.profile-list {position: absolute; top: 10px; left: 115px;}
.about-me-widget dd {padding: 3px 0px;}
.about-me-widget dd.profile-username {text-transform: uppercase;}
.about-me-widget dd.profile-name a {font-weight: bold; text-decoration: underline;}

/* calendar */
.calendar-widget {}
.calendar-widget table {width: 100%; margin-left: -5px; font-size: 11px; text-align: center; }
.calendar-widget th,
.calendar-widget td {margin: 0px; padding: 0px; border: 1px solid #ccc;}
.calendar-widget p {margin: 0px; padding: 0px;}
.calendar-widget tr:first-child td {border: 0px;}
.calendar-widget tr:first-child a,
.calendar-widget tr:first-child a:hover {font-weight: bold;}

/* link list and tags */
.categories-widget li.item a, .typelist-widget li.item a {display: block; margin: 0px; padding: 3px 0px; border-bottom: 1px solid #ccc; font-size: 1em !important;}
.categories-widget li.item a:hover, .typelist-widget li.item a:hover {background: #eee;}
.categories-widget .widget-footer, .typelist-widget .widget-footer {padding: 10px 0px 0px 0px; text-align: right;}

/* custom text */
.customtext-widget .widget-content {line-height: 1.8em;}

/* page summary */
.archive-widget ul li {padding: 3px 0px; border-bottom: 1px solid #ccc;}
.archive-widget ul li span.ljuser a {color: #333333; text-decoration: none;}

/*syndication */
.syndicate-widget img {margin-top: 5px;}

/* powered by livejournal */
.powered-widget {display: none; padding-top: 3em;}
.powered-widget .widget-content {overflow: hidden; font-size: 12px;}
.powered-widget a {font-weight: bold; text-decoration: underline;}

/* designed by */
/* leave this turned off otherwise it will credit someone else with the design */
.designed-widget {display: none;}

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

/* Comments ---------------------------------------*/
#comments {padding: 0px;}

div.comments-inner h2 {margin: 0px; padding: 1.5em 0 0 0; font-size: 1.4em;}

.comment {position: relative; min-height: 130px; margin-bottom: 3em; padding:0px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.comment-odd {}
.comment-even {background: #ffffff;}

.comments-nav {margin: 0px 0px 20px 0px; text-align:center;}

.comment-meta {padding: 5px 0px;}
.comment-meta .user-icon {position: relative; float: right; display: inline; padding-bottom: 10px;}
.comment-meta .commenter-name {font-size: 1.3em;}

/* --- 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 ---------------------------------------------------------------------- */

div.prevnext {margin: 0px 0px 2px 0px; padding: 2px; border: 1px solid #dddddd; background: #eeeeee;}
div.prevnext table {width: 100%; padding: 10px 0px; border: 1px solid #dddddd; background: #fafafa;}
div.prevnext table td {padding: 0px 10px;}

ul.year {padding: 10px; border: 1px solid #dddddd; background: #fafafa; text-align: center;}
ul.year li {display: inline; padding: 0px 5px;}

table.yeartable {width: 100%; margin: 0px auto;}
table.yeartable td.yeardate, table.yeartable td.yearday {padding: 5px; border: 1px solid #cccccc;}
table.yeartable td.yearday {background-color: #ebebeb; text-align: center;}
td.yearmonth {border-style: none; font-weight: bold; text-transform: uppercase;}
td.yeardate a {font-size: 1.5em; text-decoration: none;}

dd.viewsubjects {margin: 0 0 .75em .75em;}

.lj-view-archive #alpha, .lj-view-month #alpha {font-size: 1.2em;}
.lj-view-archive .asset-header, .lj-view-month .asset-header {margin: 0px; border: 0px; padding: 0px;}
.lj-view-archive .asset-body, .lj-view-month .asset-body {margin: 0px; border: 0px; padding: 0px;}

.lj-view-month widget table {margin: 0px !important;}

.lj-view-tags #alpha ul {margin: 10px 0px 10px 20px; font-size: 1.2em;}
.lj-view-tags #alpha ul li {padding: 2px 0px;}

/* -------------------------- */
/* ---------- MISC ---------- */
/* -------------------------- */

/* Sponsored Plus ---------------------------------------*/

#ad-5linkunit {
clear: both;
}

#ad-leaderboard {
margin-bottom: 10px;
}

/* 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; }

/* contextual pop-ups --------------------------------------- */

div.ContextualPopup div.Inner {padding: 5px; border: 1px solid #bbbbbb; background: #f3f3f3 !important; color: #333333 !important; text-align: left;}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {color: #DF1F55 !important; font-weight: bold !important; text-decoration: none !important; font-weight: normal;}
div.ContextualPopup div.Inner a:hover {color: #333333 !important; text-decoration: underline;}
div.ContextualPopup .Relation, div.ContextualPopup .Content .OnlineStatus {color: #333333 !important; font-weight: bold !important;}

/* ---------------------
PLEASE PASTE ANY FURTHER
CSS OVERRIDES BELOW HERE
--------------------- */
.lj-currents ul {list-style-type: none;}
.asset-tags ul {list-style-type: none;}

I am looking to add some spacing to the bottom of the entry so that the metadata is set apart from the rest of the entry and rearrange the tags list so the metadata will look like this:




instead of this:




Browser: Firefox 3.5.9
Account: Plus
Theme: Mixit (Bookworm Grey)

Thank you for your help.

entries:metadata

Previous post Next post
Up