Expressive and Mixit Layout Help

White line

2016-03-07T21:31:32Z

Hi,
not sure if this comm is still alive but I had to try anyway.

This line on one side appeared out of nowhere and it is bugging me.
How can I get rid of it without changing anything else? I want the lines between "comment", "share" etc. to stay.

All entries on my friends page showing my own username

2015-05-18T17:10:42Z

I'm really hoping that someone can help with my custom css, which I've been using for four or five years now.

Unfortunately, recent changes to LJ's backend have thrown up a quirk in relation to entries on my friends page (http://alyse.livejournal.com/friends) (and from poking around other users of this custom CSS (see link below), for all entries in communities, both on the community's main page and on their equivalent of the 'friends page'). Every entry on my friends page is showing not just the name of the person posting the entry (and the community, if relevant) but also my own username.

Example:

Example - community:

I have a permanent account, and the theme I'm using is based on mixit. My custom layer, with all of the css code I've added, can be found here:

http://www.livejournal.com/customize/advanced/layerbrowse.bml?id=85821970

The original CSS (before I changed colour schemes, added my own header image and some other tweaks) can be found here: http://thefulcrum.livejournal.com/7877.html. Unfortunately, no entries appear to have been made to that journal since 2011, so I suspect the original creator has abandoned LJ.

I haven't - to my knowledge - added anything to how users display other than replacing the user icon image. However, even taking that code out of the CSS override at the end doesn't fix the issue.

I've asked Support, but they're declaiming all knowledge and state that since I'm using custom CSS they can't help, and they won't even tell me what they might have changed in their code that I could even start looking for in the CSS. They may have a point about the CSS, though, as defaulting back to the mixit theme base doesn't cause the issue. But I'm at a loss, and I'm really hoping that some kind person - who knows more about how LJ code things - can help.

The full CSS code in a text box behind the cut, as I suspect it would be easier to grab and read from that than trying to read it on the user theme layer I linked.

layerinfo "type" = "user";
layerinfo "name" = "Auto-generated Customizations";
set layout_type = "2CR";
set customtext_title = "Fic Progress";
set seventh_item = "syndicate";
set fourth_item = "links";
set third_item = "customtext";
set tag_display = "list";
set page_recent_items = 20;
set page_friends_items = 20;
set sixth_item = "archive";
set customtext_body = "
<img src=\"http://www.critiquecircle.com/wordmeter.asp?w=150&col=brown&font=arial&curr=38000&goal=75000&txt=Het BigBang&\">

<img src=\"http://www.critiquecircle.com/wordmeter.asp?w=150&col=brown&font=arial&curr=50000&goal=100000&txt=Several Miles&\">";
set use_vox_base = false;
set fifth_item = "tags";
set custom_css = "/*	Template: (#25) Your Biggest Flan v. Extra Wide	 */
/*	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: 494px; background: url(http://www.alyse.info/rotate/rotate.php) 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: #3C1E00;
	background-image: url('http://pics.livejournal.com/alyse/pic/000pt54k') 
	color: #D5980B;
	font-family: \"trebuchet ms\", tahoma, verdana, arial, sans-serif;
	font-size: 62.5%;
	text-align: center;
	}

a, a:link, a:visited, a:active {color: #D5980B; text-decoration: none;}
a:hover {color: #D5980B; text-decoration: underline;}

p {margin-top: 0.8em; margin-bottom: 0.8em;}

blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px dashed #D5980B; background: #F9E0A5;}

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; padding: 20px; font-size: 1.2em; line-height: 1.8em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}

#page {width: 960px; margin: 0px auto; padding: 0px; border: 1px solid #D5980B; background: #FDFBF3;}

#header-inner {margin: 0px auto;}

#content {text-align: left;}

#alpha {width: 760px;}
	.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%; padding: 0px; height: 40px; line-height: 40px; border-top: 1px dashed #D5980B; border-bottom: 1px dashed #D5980B; background: #F9E0A5; text-transform: lowercase; background-image: url(http://pics.livejournal.com/alyse/pic/000qhdhy); background-repeat: no-repeat; }
#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: #604405; font-size: 1.4em; text-decoration: none;}
#header-text ul.nav a:hover {color: #D5980B;}

#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: #604405; text-decoration: none;}
#header-name a:hover {color: #D5980B;}
#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 #D5980B;}
.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: 2em; font-weight: normal;}
h2.page-header2 a, .lj-view-tags h2 {color: #604405; text-decoration: none;}
h2.page-header2 a:hover {color: #333333;}

abbr.datetime {
	margin: 0px; padding: 0px;
	list-style-type: none;
	color: #666666;
	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: #604405; font-weight: bold; border-bottom: 1px dashed #D5980B; text-decoration: none;}
.asset-body a:hover {color: #333333;}
.asset-body dt {border-bottom: 1px dashed #D5980B; font-weight: bold;}
.asset-body dd {margin-left: 3.6em; padding: 10px; background: #F9E0A5; border: 1px dashed #D5980B; 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 img {border: 1px solid #D5980B;}
.user-icon span {background: #FDFBF3 !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: #604405; border-bottom: 1px dashed #D5980B; font-size: 1.3em; text-transform: uppercase; background-image: url(http://pics.livejournal.com/alyse/pic/000qkqap); background-repeat: no-repeat; background-position: right top;}
.widget-content {margin: 0px; padding: 0px;}

.widget ul {margin: 0px; padding: 0px 0px 0px 20px;}
.widget a {color: #333333;}
.widget a:hover {color: #604405; 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: #D5980B;}
.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: #FDFBF3; border: 0px;}
	.calendar-widget td a {display: block; width: 100%; color: #604405; background: #F9E0A5; border: 1px solid #D5980B;}

/* link list */
.typelist-widget li.item {margin: 0px; padding: 0px; list-style-image: url(http://pics.livejournal.com/alyse/pic/000qqkd0); }

/* tags */
.categories-widget .widget-footer {padding: 20px 0px 0px 0px;}
.categories-widget li.item {margin: 0px; padding: 0px; list-style-image: url(http://pics.livejournal.com/alyse/pic/000qqkd0); }
.categories-widget li.tag {display: inline; padding: 0px 1px; background: none; }

/* post summary */
.archive-widget li.item {margin: 0px 0px 5px 0px; padding: 0px; list-style-image: url(http://pics.livejournal.com/alyse/pic/000qqkd0); }

.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: #604405; font-size: 2em; font-weight: normal;}

.comment {margin-bottom: 1.8em; padding: 0.9em 0; border-bottom: 1px dashed #D5980B;}
.comment-odd {}
.comment-even {background: #FDFBF3;}

.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 #D5980B;}
table.yeartable td.yearday {background-color: #F9E0A5; 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;
}

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

/* Generated by Malionette's Tiny Icon Generator 
   http://malionette.net/generator/tinylite.html */

span.i-ljuser img[src*=\"img/userinfo.gif\"] {width: 0 !important; height: 0 !important;
background: transparent url(http://pics.livejournal.com/alyse/pic/000tgcqt) no-repeat !important; padding: 23px 0 0 23px !important; }
span.i-ljuser img[src*=\"img/community.gif\"] {width: 0 !important; height: 0 !important;
background: transparent url(http://pics.livejournal.com/alyse/pic/000ys0hz) no-repeat !important; padding: 23px 0 0 23px !important; }
span.i-ljuser img[src*=\"img/syndicated.gif\"] {width: 0 !important; height: 0 !important;
background: transparent url(http://pics.livejournal.com/alyse/pic/000ytt3h) no-repeat !important; padding: 23px 0 0 23px !important; }
img[src*=\"img/icon_protected.gif\"] {width: 0 !important; height: 0 !important;
background: transparent url(http://pics.livejournal.com/alyse/pic/000yxwxx) no-repeat !important; padding: 22px 0 0 19px !important; }

.b-repost-item, FORM#qrform > TABLE[style=\"border: 1px solid black;\"]:last-child TD[style=\"vertical-align: top; text-align: right;\"]:first-child { display: none !important; }";

set tag_display = "list";

function print_module_tags(string title) {

#####   Config   #####
  # Specify your delimiter.  One char only -- extra chars get truncated.
  var string delimiter = ":";
  # Do you want to show the tag use counts?
  var bool show_count = true;
  # Specify the text to show just before the use count, if any
  var string pre_count = "[";
  # Specify the text to show just after the use count, if any
  var string post_count = "]";
##### End Config #####

var Page p = get_page();
  var string list = "";

if (size $p->visible_tag_list() > 0) {
    if ($delimiter->length() > 1) {
      $delimiter = $delimiter->substr(0, 1);
    }

var string[] closing_html;
    var string[] prev_tags;
    var int tag_list_pos = 0;
    var string tier_code = "";
    $closing_html[0] = "";
    $prev_tags[0] = "";
    foreach var TagDetail t ($p->visible_tag_list()) {
      var string[] tags;

if ($t.name) {
        # mt:20050623
        # Split tags into array on delimiter. Oh god, my kingdom
        # for a function.  Stolen shamelessly from lj-user rane500.
        var int array_counter = 0;
        var string buffer = "";
        foreach var string char ($t.name) {
          if($char == $delimiter) {
            $tags[$array_counter] = $buffer;
            $array_counter = $array_counter + 1;
            $buffer = "";
          }
          else {
            $buffer = $buffer + $char;
          }
        }
        $tags[$array_counter] = $buffer;

var int pos = 0;
        foreach var string tier($tags) {
          if (size $closing_html <= $pos) {
            # mt:20050623
            # $closing_html keeps track of html that is used to close off open
            # lists.  Its length must be kept >= to that of the current tag.
            $closing_html[$pos] = "";
          }

if (size $prev_tags <= $pos) {
            # mt:20050625
            # The current tag has more tiers than the previous tag.  To avoid array
            # ref errors when comparing the current tier to the previous one (which
            # is non-existent, of course) add empty string to $prev_tags.
            $prev_tags[$pos] = "";
          }

# mt:20050623
          # If we're on a tag's last tier, we need to return a link to the tag,
          # otherwise plain text is returned.
          if (size $tags == ($pos + 1)) {
            $tier_code = """<a href="$t.url">$tier</a>""";
            if ($show_count) {
              $tier_code = $tier_code + """ ${pre_count}${t.use_count}${post_count}""";
            }
          }
          else {
            $tier_code = """$tier""";
          }

# mt:20050625
          # $prev_tags stuffed with dummy empty string when it has fewer tiers than
          # current tag.
          if ($prev_tags[$pos] == "") {
            # mt:20050623
            # The current tag has more tiers than the previous tag, so a new
            # list must be opened.
            $list = $list + """<ul class="widget-list"><li class="item">$tier_code""";
            $closing_html[$pos] = "</li></ul>";
          }
          elseif ($tags[$pos] != $prev_tags[$pos]) {
            # mt:20050623
            # The current tag's tier is not the same as the previous tag's tier of
            # the same level.  This means we may need to close some lists.
            var int i = 0;
            foreach var string html ($closing_html) {
              if ($i > $pos) {
                $list = $list + $closing_html[$i];
                # mt:20050623: As we append the closing code, pop it off the array.
                $closing_html[$i] = "";
              }
              $i++;
            }

if ($closing_html[$pos] == "") {
              # mt:20050623
              # This is the first tier at this level, so open list.
              $list = $list + """<ul class="widget-list"><li class="item">$tier_code""";
              $closing_html[$pos] = "</li></ul>";
            }
            else {
              # mt:20050623
              # There have already been tiers added at this level, so just close the previous
              # list item before adding the new tier.
              $list = $list + """</li><li class="item">$tier_code""";
            }
          }
          else {
            # mt:20050623
            # The current tag's tier is exactly the same as the previous tag's tier at
            # this same level.  It has already been included in the list, so do nothing.
          }
          # mt:20050623: Moving on to next tier in this tag!
          $pos++;
        }
        $prev_tags = $tags;
      }
      # mt:20050623: Next tag in the list!
      $tag_list_pos++;
    }

# mt:20050623
    # All the tags have been added so close all outstanding lists.
    var int i = 0;
    var string remaining_html = "";
    foreach var string html ($closing_html) {
      if ($html != "") {
        $remaining_html = $html + $remaining_html;
        $closing_html[$i] = "";
      }
      $i++;
    }
    $list = $list + $remaining_html;
  }

open_module("categories", $title, "");
  print """$list""";
  var string tags_url = $p.journal->base_url() + "/tag/"; # TODO: Need Page.view_url{"tags"} which doesn't exist yet.
  print """<div class="widget-footer"><a href="$tags_url" title="$*text_sidebar_tags">$*text_sidebar_tags</a></div>\n""";
  close_module();
}

Nav Links and Title/Subtitle Help Needed

2014-05-07T21:02:43Z

Can anyone help me edit my code? I'm trying to move the nav links and title/subtitle to different positions on my header. Is there a code I could use where I could adjust the number settings till I have each thing in the position I want. I'm still pretty new to CSS so I'm kind of lost here.

I'm using google chrome, the expressive layout, have a plus account, and am posting from the same journal I need help fixing.

element {

}

#header-inner {

background-image: url("http://i1116.photobucket.com/albums/k580/Katherine_Gibbons/redstripe_zpsf4e57836.jpg");

height: 245px;

}

#header {

padding-top: 0;

}

#header-content-inner {

position: absolute;

top: 64px;

left: 0px;

}

#header-inner {

margin-bottom: 0;

}

#header-name a {

text-decoration: none;

font-weight: bold;

font-size: 28px;

color: rgb(255, 255, 255);

text-decoration: none;

}

text-decoration: none;

}

#header a {

font-weight: normal;

}

#header-text a {

color: rgb(255, 255, 255);

}

a {

color: rgb(85, 126, 161);

}

a {

text-decoration: underline;

}

a {

text-decoration: none;

}

#header-text {

color: rgb(255, 255, 255);

}

#container-inner {

text-align: left;

}

body {

color: rgb(51, 51, 51);

font-family: trebuchet ms;

}

body {

color: rgb(51, 51, 51);

font: 13px arial,helvetica,sans-serif;

}

#header-name {font-family: bella donna; letter-spacing: 0.1em; font-weight: bold; }

#header-description {font-family: georgia; letter-spacing: 0.1em; font-weight: bold; font-size: 15px; }

creating own css classes? possible?

2014-02-22T13:12:47Z

i searched for a faq or help page mentioning it, goggled like mad, didn't find it...
though it's such a basic question ~

is it possible at all to add OWN classes/IDs?? ! IN THE CSS PANEL + ENTRY !
without to touch the layer - only HTML in the entry (i have 1 recurrent div or table i'd like to customize) and a corresponding css block in my sheet. because if i have to write the style inline for every div/table in the entry (a faq), it will fill my entry allowed space in no time, and give me a headache looking at its code.

i tried, it works inline:

but not calling the css with a class, it doesn't work, but i probalbly screwed up - or it's impossible.

in the entry:

and in my css panel (no ext sheet)

.faqGreen {
border: 1px solid green;
background-color: aqua;
color: #221203;
border-radius: 20px;
}

what am i forgetting? or is it sheer impossible on lj?

because when i test it in notepad++, with the style in the header (EXACTLY what LJ does with the css from the customize panel! i can see it in my page's header looking at the source code) - it WORKS.
though, when i look at my page with mozilla's webinspector, and pick this div or table (i tried both), even i can see the css block in my header, no mention of my "faqGreen" formatting on the element itself. i tried !important too btw, no use. as if it had been stripped.. somehow? "inbetween?" makes no sense ~

Stuff under icons on Friends list

2014-01-30T13:23:54Z

Can anybody help me with this?

I had no problem whatsoever a while ago but latest LJ idiotic unwanted changes managed to create this problem for me.

It used to be only one layer of background picture, icon and text (username and community name or just the username) with my customized rose userheads underneath, now it looks like this pile of garbage.

WARNING: NSFW content on my LJ!

LJ automatic image-resizing unwanted [SOLVED]

2014-01-22T12:48:13Z

hi ^^

i noticed this yesterday, but it might have happened a while ago - i just didn't see it.
obviously, LJ (recently?) does resize images when they don't have BOTH width & height specified..?

i have this post here with the little avatars. save for the pink one, they were all a bit too big to stand in one line (there were 2 more originally) with their original height of 120px, and a bit pixelated too, so in my entry i specified per html "height="100px". i didn't specify a width because it worked fine like this.
but as i looked the avatars more in detail yesterday (i want to add some soon), the line seemed weird to me - and bingo, the reason is they show now in their original size of 120px. though, the html is still correct in the entry.

i have the same entry with the same code in my dreamwidth here, and since DW hasn't added this resizing ~~bug~~ feature, it still shows how i want/how i html'ed it. i could swear this LJ entry looked how i wanted it, at least in the beginning.. because i had 2 more avatars in the line, and with the 120px size it's impossible.

fact is, as i checked with mozilla's tool "inspector", i came across this:

.j-p-resize-all-images .asset-body IMG:not([class="i-ljpoll-results-bar"]),
.j-p-resize-images-without-sizes .asset-body IMG:not([width]):not([height]) {
height: auto;
max-width: 100%;
}

it comes from an internal LJ css sheet, nr /:2052

the height is the screwy one, when i switch this off in the inspector the images are 100px like in my html again.
i tried to add this same code in my css and modify the parameters, adding !important, but nothing works. the problem being, there is no "not-auto" parameter, inherit/none shows no change, and of course an exact px amount can't apply to all images/entries. nonsense (like: % alone, empty..) to make the code plant doesn't work either.

how can i get rid of this? i don't want to control all my pics and edit all entries to add the missing heights/widths.
i usually use my images how i upload them, or resize only the entry relevant height OR width (post width, cell height..) when necessary. first because it's enough (without this feature), second i don't know exactly what the other parameter will become or i'd have to calculate it.

as far as i know, you can't override LJ css with user css so your entry html is respected again - but maybe i'm wrong?

Hopefully, someone is still around...

2014-01-01T23:24:15Z

Okay, so I'm trying to help a friend customize 'Icicles.' I can't seem to get the header image to center.

Here's the CSS code we're using...

IN ACTION: http://doeeyedbecky.livejournal.com/?s2id=27008709

We'd like the header image centered and the text below the header, not on it.

What are we doing wrong?!?

Another not improving LJ "improvement"

2013-12-08T10:38:15Z

Is there a way to get rid of this thing? It keeps covering text which annoys me to no end.

Making it "semi-transparent" just makes my eyes and head hurt.

Change Previous/Next Color

2013-08-08T17:03:06Z

I am almost done with my layout. Except one thing. I cannot find the code that changes the Previous/Next links to the same color as my layout links. Can anyone help?

Post background help?

2013-03-29T04:27:08Z

Hello! I don't know if this has been answered yet, I did a bit of looking but wasn't able to find it...

I'm looking to change the background color of my posts/the inner box area. The main page background is fine, I just want the inner portion to be black or dark grey, with white text. I love reading off my phone at night and I'm sure a lot of other people do as well, so I'm hoping changing my journal to a more "night mode" look would make reading a little easier.

I have a paid account, and I'm using Minimal Blue.

This is all the CSS I'm using right now, for the header and such:

html body {

padding: 10px 0 0 0;

margin-right: 0;

margin-left: 0;

}

/* dump the journal name */

#header-name, #header-description {

display: none;}

/* -------------------------------------------------------- */

/* ---------- ADD YOUR HEADER GRAPHIC BELOW --------------- */

/* -------------------------------------------------------- */

#header {position: relative; height: 360px; width: 1220px; background: url(http://i.imgur.com/fEonZ.png) top center no-repeat;}

#header-inner {

width: auto;

height: 370px;

}

#header-text {

position: relative;

top: 320px;

width: auto;

}

#header .nav, #header-name {

margin-bottom: 5px;

width: 1220px;

background: #000000;

}

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

/* -------------------------------------------------------- */

Thanks!

Help with a custom text box OR removing date/footer text from stickypost please?

2013-03-06T10:12:24Z

Hey guys, it feels like forever since I've messed around with modding LJ! I hope anyone can help though because I'm going loopy here.

My LJ layout is perfect, but I'd like a sort of custom text above my entries, just below the header. Ideally it'd be an "about me | art tag | commissions" type linkbar. Is there any way I can just put some code in that'll add that?

If not, I'll happily just do it as a backdated stickypost, but I REALLY don't want to have a post with a date/subject/footer at the top(or bottom) of the page because I don't want it to be confusing. I don't want it to be mistaken as a journal entry, I'd like to use it simply as an extra custom text box. Is there any way to remove the date/subject from a sticky post?

Basically, I'd like exactly what THIS community has - a top post with no date and no footer and just sitting there looking pretty.

Thanks so much for any advice anyone can offer. I googled about removing dates from sticky posts but only came up with bloggish layout help :/

re-positioning journal title and subtitle, and making header align with entries

2013-03-01T22:18:16Z

I searched through the tags, but couldn't find anything that quite fit my problem. When it comes to CSS, I'm pretty much fumbling around in the dark, so please bear with me if my questions are completely dense.

I'm trying to set up a new community: team_alpha. The community account is paid, and I'm working with the Red Label theme. I managed to add a header image, but my journal's title and subtitle are positioned right in the middle of it, obscuring the picture. Can someone please help me move them?

Also, is there a way to make the header image align with the entries column? I've figured out how to align the header image to the right edge of the entries column, and how to center it across the entire page, but if it's possible, I'd love for it to match up perfectly, no matter what size the browser window is.

If it helps, this is the custom CSS I'm using right now:

#header-inner {
background-image: url(http://i68.photobucket.com/albums/i14/Piscaria/TAHeader950x200_zpsdcc899e1.jpg); background-repeat: no-repeat; background-position: top right; height: 200px; margin: 0 auto;
width: 671px; /* 950 */

}

Thanks for any insight you guys can give!

Solved: Change title and subtitle font

2013-02-09T23:51:09Z

Is there a code for changing the font of just the title and subtitle? I'm using firefox 18, ghouls black, and have a plus account.

Thanks for help in advance.

element {
}
#header-inner {
    background-image: url("http://i1116.photobucket.com/albums/k580/Katherine_Gibbons/redstripe_zpsf4e57836.jpg");
   height: 245px;
}

#header {
background-image: none;
padding-top: 0;
}

#header-content-inner {
    position: absolute;
    top: 67px;
    left: 20px;
}

#header-inner {
margin-bottom: 0;
}

Solved: White Around Header

2013-02-09T09:58:04Z

Hi I'm new to working with CSS and could use some help. All I really want to do at the moment is switch out the image for my header and have everything lined up as it was with the original image. Unfortunately I'm getting extra white space above and below my image.
If anyone could help me figure out the code to fix the look I'd appreciate it. I'm currently using firefox 18 and my theme base is ghouls black.

#header-inner {
    background-image: url("http://i1116.photobucket.com/albums/k580/Katherine_Gibbons/redstripe_zpsfa862c2b.jpg");
   height: 200px;
}

#header {
    background-image: none;
}

Thanks for any help you can offer!

How Do You Move Navigation Borders? SOLVED!

2013-01-29T07:50:33Z

I almost got my journal the way that I want it. The main problem is that once I center the navigation bar, the left side sticks out. I did this once a long time ago but now I forget how to do it. Any help would be appreciated.

EDIT This is for regisjr and I use Firefox witha PAID account..

#header-inner {
background-image: url("http://img.photobucket.com/albums/v318/jayregee/gaypridebanner.png");
height: 480px;
width: 800px;
}

#header {
background-image: none;
}

a, a:link, a:visited, a:active {color: text-decoration: none;}
a:hover {color: ; text-decoration: underline;}

p {margin-top: 0.8em; margin-bottom: 0.8em;}

blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px #bbbbbb; background: #e6e6e6;}

#header-name {display: none;}
#header-description {display: none}

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

#header-text ul.nav {position:absolute; bottom: 0px; left: 0px; margin: 0px; padding-left: 210px; height: 40px; line-height: 40px; border-top: 1px #bbbbbb; border-bottom: 1px #bbbbbb; background: #e6e6e6; text-transform: uppercase; }
#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: ; font-size: 2.0em; text-decoration: none;}
#header-text ul.nav a:hover {color: #333333;}

#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: #; text-decoration: none;}
#header-name a:hover {color: #333333;}
#header-description {display: none; margin: 0px auto; }

body {
background-color: black !important;
background-image: url("http://img.photobucket.com/albums/v318/jayregee/rainbowflag-1.png") !important;
background-repeat: repeat !important;
background-attachment: fixed !important;
background-position: 2% !important;
}

.designed-widget { display: none; }

a:link,
a:visited,
a:hover,
a:active {
text-decoration : none;
}

#footer {
background-image: url(http://img.photobucket.com/albums/v318/jayregee/gayfooter.png);
}

#container-inner, #header-inner {
width: 800px; /* Change the width of the header and overall container boxes*/
}
#alpha {
width: 610px; /* Overall width minus sidebar width*/
}
.layout-tw #alpha-inner {
width: 574px; /* Width of #alpha minus 40px margins*/
}

Please Help and Thank You!

Sidebar disappeared -- SOLVED --Thanks!

2013-01-25T17:21:30Z

A friend made me a new header image for my journal. I went in and changed the link and the widths to make it fit. Now I only have the option for a 1 column layout when before I had 2 columns with the sidebar on the right. Now my sidebar is at the bottom, and it looks ugly.

Is there a way to get my sidebar back?

I am using the minimalist green layout.

Here's the link to my journal: scratchingpost1

Here's my custom CSS:

body, .widget-header,
.widget .widget-header a,
.nav .item a {font-family: Arial, Veranda, sans-serif;}

.asset-body { font-family: Arial, Verdana, sans-serif; }

#header-inner {
    background-image: url(http://img.photobucket.com/albums/v397/mrsdrake/MalNick22013.png); height: 279px;}

#header {background: #000000; background-image:none; padding-bottom: 2px; }

.asset-stream .asset-header-content {background-image: none;}

#container-inner, #header-inner {
    width: 1023px; /* Change the width of the header and overall container boxes*/ }

#alpha {
    width: 900px; /* Overall width minus sidebar width*/ }

.layout-wt #alpha-inner {
    width: 860px; /* Width of #alpha minus 40px margins*/ }

#header-content-inner { margin: 250px 15px 125px 625px;}

.asset-stream  .asset-header-content {width: inherit;}

.page-header2 { font-weight: bold; font-size: 19px;}

#page { background-color: #eeeeee; }

body {background-image: url(http://img.photobucket.com/albums/v397/mrsdrake/HP/greenswirls-1.jpg); background-repeat: repeat; background-attachment: fixed;}

#header-text { width: 832px; margin: 0 0 0 10px; float: left; font-size: 14px;}
#header a { font-weight: normal; font-size: 14px;}

#header-name a { text-decoration: none; font-weight: bold; font-size: 14px; color: #ffffff; }

#header .nav .item { border-left: 1px solid #ffffff; font-size: 14px;}
#header .nav a { font-weight: normal; color: #ffffff; font-size: 14px;}

#header-name { display:none; }

#header-description { display: none; }

a { color: #003e1e; }

.page-header2, .page-header2 a { color: #003e1e; }

.page-header1, .page-header1 a, .asset-subtitle { color: #003e1e; }

.widget .widget-header, .widget .widget-header a { color: #003017; font-weight: bold;}

.archive-widget ul.widget-list .item, .widget a, #alpha .asset-meta-list a { color: #003e1e;}

.asset-tags-list a:hover { background-color: #003e1e; }

.asset-stream-grid .asset-name a, .enclosure-asset-name, .enclosure-asset-name a, #profile .user-favorites-list .asset-name a { color: #003e1e;}

.pager, .pager a { color: #003e1e;}

.pager .item { border-color: #003e1e;}

.group-nav-list .item { border-color: #003e1e;}

.group-button a { background-color: #003e1e; border-color: #ffffff; color: #ffffff;}

.group-button a:hover { background-color: #ffffff; border-color: #032710; color: #032710;}

.comment-even { background-color: #d7d7d7; border: 1px solid #000000; }

#comment-form, .enclosure .enclosure-inner { border-color: #000000; }

#post-asset-detail .asset-detail-meta-inner { border-color: #000000; }

#group-nav { border-color: #000000; background-color: ; }

.group-home .stream-content { border-color: #000000; }

.asset-name-hover { background-color: #eeeeee; }

.b-repost-items { display: none; }
.b-repost-item { display: none; }
.b-repost-item .repost_disabled { color: #CCC; }
#entry-form-wrapper .b-repost-item { display: none; }
.b-repost-item IMG { display: none; }

.b-repost-item, FORM#qrform > TABLE[style="border: 1px solid black;"]:last-child TD[style="vertical-align: top; text-align: right;"]:first-child { display: none !important; }

Here's my custom theme layer:

layerinfo "type" = "theme";
layerinfo "name" = "Minimalist-Depp";
layerinfo "source_viewable" = 1;

set base_theme = "minimalist-green";

### Customize this.

set text_nosubject= "(no subject)";

#===========================================
# DON'T REPLACE THE SUBJECT WITH THE DATE #
# USE NO SUBJECT TEXT #
#===========================================

function print_entry(Page p, EntryLite e, Color bgcolor, Color fgcolor, bool hide_text) {
    var bool showposter = false;
    if (not $e.poster->equals($e.journal)) { $showposter = true; }

var Comment c;
    var Entry en;
    if ($e isa Comment) {
        $c = $e as Comment;
    } else {
        $en = $e as Entry;
    }

var string id = "";
    if (defined $c) {
        $id = " id=\"asset-$e.journal.username-$c.talkid\"";
    } else {
        $id = " id=\"asset-$e.journal.username-$en.itemid\"";
    }

"""
    <div$id class="post-asset asset">
      <div class="asset-inner">
        <div class="asset-header">
          <div class="asset-header-inner">
            <div class="asset-header-content">
              <div class="asset-header-content-inner">
                <h2 class="asset-name page-header2">""";

if (defined $en) {
        if (defined $en.security_icon) {
            """<span class="lj-entry-securityicon">$en.security_icon</span> """;
        }
    }

var string subject  = "";
    var string datetime = "";

if ($e.subject != "") {
        $subject  = striphtml($e.subject);
    }
    else {
        $subject  = $*text_nosubject;
    }

$datetime = lang_posted_by_date_and_time($e, $showposter, true, true);

"""<a href="$e.permalink_url">$subject</a>""";
    "</h2>";

"""
          <div class="asset-meta">
            <ul class="asset-meta-list">
              <li class="item"><span><abbr class="datetime">$datetime</abbr></span></li>
            </ul>
          </div>
        </div></div></div>
        </div> 
        <div class="asset-content">
            <div class="asset-body">""";

var bool showuserpic = $*opt_userpic_main;
    if ($p.view == "friends") { 
        $showuserpic = $*opt_userpic_friends;
    }
    if ($p.view == "entry") {
        $showuserpic = $*opt_userpic_entrypage;
    }

var string userpic = ($showuserpic and defined $e.userpic) ? ($e.userpic + "<br />") : "";
    if ($showuserpic) {
        if ($bgcolor) {
            """<div class="user-icon" style="border: 1px; padding: 2px; background-color: $bgcolor;">$userpic""";
        } else {
            """<div class="user-icon">$userpic""";
        }
    }

var string posted = "";
    if ($p.view == "friends") {
        if (not $e.poster->equals($e.journal)) {
            $posted = $posted + colored_ljuser($e.poster, $bgcolor, $fgcolor) + "<br />";
        }
        $posted = $posted + colored_ljuser($e.journal, $bgcolor, $fgcolor);
    } else {
        if (not $e.poster->equals($e.journal)) {
            $posted = $posted + $e.poster;
        }
    }
    print "$posted";

if ($showuserpic) {
        print "</div>";
    }

$e->print_text();

"</div>\n";
    if (defined $en) {
        $en->print_metadata();
    }

"</div>\n";
    $p->print_reply_container({"target" => "entrycomment", "class" => "quickreply"});
    $e->print_linkbar();

"""<div class="asset-footer"></div>\n</div>\n</div>\n""";
    if ($*entry_footer != "") {
        println safe $*entry_footer;
    }
}

SOLVED: Header is uncentered and title too large

2013-01-17T01:08:10Z

Okay, so I'm fairly awful at technology and I have no idea how to fix this; basically, my header (which you can see on the same lj I use to post this) is just a few pixels off-center for no apparent reason. I'd also like to make the title smaller and italic if I can; the title is just the automatic one lj uses, which becomes your username if you try to get rid of it.

I'm using Google Chrome, and layout #02, but this same problem occured when I was using the Nebula layout.

Icons for metadata

2012-08-29T08:00:05Z

Sorry if this has been covered before; I came here looking for a way to style the class-less metadata items individually and found no answer, so I wrote a small hack. Posting here for my own reference and in case anyone else finds it useful. I'm on a basic account.

->

The problem is that the location/music/mood metadata items have no type-specific classes, so there's no easy way to style them by type if you want to give them icons.

The general idea of the fix is:

1. Put your icon for music on .lj currents li. Set it as bg image and add some padding to make room for it.

2. Put your icon for location on .lj-currents .entryMetadata-content a (location is the only metadata that has an anchor afaik). You also need to add the following properties:

/* pseudocode */
background-color: [same colour as whatever bg is visible behind the element];
background-repeat: no-repeat;
display: block;
margin-left: [some negative number to pull your icon left if it's on the left of the text];
margin-right: [same as above, if your icon's on the right];
padding-left: [at least the width of your icon, if it's on the left];
padding-right: [same as above, if icon is on the right];
height: [at least the height of your icon];

So you're covering up the music icon with the location icon.

3. Do the same with the mood icon, except this time your selector is .lj-currents .meta-mood-img. You/your users must be using a mood theme, or the element you need won't exist. Which moodtheme does not matter as you're hiding it anyway.

In that ruleset, replace the moodtheme icon with your own the same way you replace userheads: set width/height to 0, and add padding to accommodate your background-image.

You have to mess around finding correct padding/margin numbers for each item to get them to line up, but it seems to work. Let me know if you got any issues/improvements.

SOLVED Minimal Black - Banner and Header size problems.

2012-08-14T17:03:15Z

Hello.

I'm a total rookie in expressive layouts and CSS codes, and my lj-english isn't perfect, so sorry for any stupid mistakes from my side.
My layout is Minimal Black in s2.

Problem is, after adjusting all names and quotes I tried to put some banner between line with links (friends, userinfo, archive) and header title. I use simplest code i found:

#header-inner {

height: 200px;

}

#header {

}

Unfortunately it put image behind other elements of header rather than beetween them. And because image is black and white, and so is header - whole thing become rather unreadable. I'm interested is there possibility to put banner image over header rather than behind it.

Thank you very much in advance for all help.

sld

noob questions: Mixit vs Expressive; #footer content; sidebar/column layouts

2012-08-09T17:19:57Z

Hi, hopefully these aren't covered in existing posts; I had a quick look through the tags but didn't find answers. I'm on a basic account.

1) If Expressive and Mixit are the same layout, why does it go by two names?

2) Does content ever appear in #footer? If so, what content, and how can I see it?

3) Where do I choose between the different column layouts described in this post?

SOLVED super simple background color change

2012-06-27T21:22:06Z

okay - i feel like a SUPER idiot for not being able to figure out what i need to fix here - i've looked all through the tags and tried various things - here's my issue:

i'm using inked red at a basic acct level
i look at it in the most up-to-date google chrome browser

so when you're looking at inked red, there's this parchment-like paper in the middle with these beige borders to the far left and right - i want to change that beige color to black and can't figure out how it's done - what do i need to add into the custom css section to accomplish such a thing?

the last thing i've tried is to put the following text in the "custom CSS" box on my customize page:

set custom_css = """

theme_fgcolor = "#000000"

""";

(if someone could please just give me the code i need to copy/paste in, i'd VERY much appreciate it - i feel like such an idiot)

Scrollbar for Tags List, Make Header Title Smaller [SOLVED]

2012-06-24T18:34:39Z

Hi I am very new to expressive, no idea about CSS whatsoever, everything did so far is by trial and error.

Type of account: Plus.
Theme: Minimal Black

Things I would like to tweak in my journal:

1. My header title is too big, I tried using this code:

#header-name a {
font-size: xxxpx;
}

but it doesn't seem to do anything.

2. I would like to add a scrollbar to the tags list in the sidebar if possible, my tags list is getting too long. I trawled through this comm but can't seem to find something that may help.

Codes I currently have in my "Custom Stylesheet" box:

.asset-body {

text-align: justify;

}

.post-asset .asset-body { line-height: 2.0em; }

#container-inner {

width: 900px;

}

#header {

background: url(MYURL) left top no-repeat;

margin: auto;

height: 180px;

}

#header-name {

text-align: right;

}

#header-name a {

font-size: 10px;

}

#header-description {

font-family: "Georgia", sans-serif;

margin-left: 225px;

font-style: italic;

font-weight: bold;

font-size: 18px;

}

#header-text {

top: -35px;

}

a[href*=memories] {display: none;}

Thank you very much in advance for your help folks! :)

Tiny Usericons are overwritten by LJ custom userhead - SOLVED! THANKS

2012-06-21T09:47:56Z

Hello,

I've just noticed that the tiny icons I use are overwritten by the custom userheads from LJ. I've managed to mess with the padding to set name and icon in one line again but I'm lost to figure how to remove the custom userhead again. The picture name doesn't seem to have changed. So I'd be really grateful if you could have a wee look.
It doesn't affect the icons for protected entries, just User and Community Icons.

I use Expressive and have a Paid account.

The layer I use is ID: 15976402

<br />/* Tiny Icons Stuff --*/<br /><br />/* so that IE users will see a new image */<br />* html span.ljuser{<br />background-image: url(http://img.photobucket.com/albums/v429/MTina/Various%20-%20also%20crap%20-/Moving%20Pics/Boards/LJ/Friends-2.png) !important;<br />background-repeat: no-repeat;<br />background-position: left middle;<br />padding: 0px 18px 18px 0px !important;<br />}<br />* html span.ljuser img{<br />visibility: hidden;<br />}<br /><br />/* icon for users */<br />.ljuser img[src*="userinfo.gif"] {<br />width: 0;<br />height: 0;<br />background-repeat: no-repeat;<br />background-image: url(http://img.photobucket.com/albums/v429/MTina/Various%20-%20also%20crap%20-/Moving%20Pics/Boards/LJ/Friends-2.png) !important;<br />padding: 0px 2px 2px 0px !important;<br />}<br /><br />/* icon for communities */<br />.ljuser img[src*="community.gif"] {<br />width:0;<br />height: 0;<br />background-repeat: no-repeat;<br />background-image: url(http://img.photobucket.com/albums/v429/MTina/Various%20-%20also%20crap%20-/Moving%20Pics/Boards/LJ/Com.png) !important;<br />padding: 0px 2px 2px 0px !important;<br />}<br /><br />/* icon for sponsored communities */<br />.ljuser img[src*="sponcomm.gif"] {<br />width:0;<br />height: 0;<br />background-repeat: no-repeat;<br />background-image: url(http://img.photobucket.com/albums/v429/MTina/Various%20-%20also%20crap%20-/Moving%20Pics/Boards/LJ/Com.png) !important;<br />padding: 0px 2px 2px 0px !important;<br />}</p><br />

s2expressive @ 2012-06-16T18:09:00

2012-06-16T23:09:39Z

A couple revisions ago the timestamps on comments broke for me. Instead of displaying in my local time zone, they display in UTC. This only happens in my theme, Mixit. The default theme (i.e. with ?format=light) displays them in my time zone correctly. I don't see any options to change this in the Mixit settings, so how can I fix this?

[SOLVED] IE8 causing entry headers/text to "nest" when mood icon present

2012-06-07T15:35:46Z

I am using a modified (sidebar hidden) version of "Joffrey Is the Worst" by thefulcrum with a custom theme layer.

It looks perfectly fine in FF and Chrome but when I load it in IE8, the entries on my main journal page and friends page start "nesting" every time a mood icon is used; the 2em padding is first ignored altogether and then added incrementally to every entry for some reason.

/* mood, music, location */
.lj-currents {padding: 0 2em;}
.lj-currents ul {list-style-type: none; font-size: 11px;}
.lj-currents ul span.entryMetadata-label {margin-right: 0.5em; font-family: Verdana, Tahoma, sans-serif;}
.lj-currents ul li a:hover {text-decoration: underline;}
.lj-currents img {float: left; margin: 0 0.5em 0.5em 0; }

I've Googled somewhat extensively for a hack but haven't been able to find anything that worked; no matter what I do, FF and Chrome both display the journal normally and IE8 just won't. In particular, adding display: inline; had no effect in IE8 but caused all mood icon images to migrate to the far left of the main (alpha) div in FF12.

If anyone has any advice for how to get around this, I'd appreciate it! Otherwise I'll just have to take comfort in the fact that IE users account for about 18% (and shrinking) of the global user base /o\