I'm having a problem formatting the content of my entries, and I've yet to find a solution for it. I really noticed this was a problem when I tried centering/blockquoting content in my entries, and the content was displaced by the user icon. Also, I don't like having text wrapped the user icons in my entries, and I tried the solution offered here, but that didn't fix it. I also tried .user-icon { float: right; } to see if putting the user icon to the right sode of entries would fix it, and not only did I not like having the icon on the right side, it didn't fix the formattting problem, either.

What I want basically, is for there to be a margin of space below the user icon that is the length of the entry's content. To the right of that, I want the entry's content, and I don't want the formatting of it to be affected by the user icon. I do, however, want the footer stuff (metadata & comment links) to be aligned left with the user icon, rather than the entry content.

Also, how do I change the order of the meta data listed at the bottom of each entry? I want to change the order so that current mood is at the top of the list and location after both mood & music. As it is, the mood icon usually takes up more space than that currrent mood line of text, so it pushes the "location" line of text floating somewhere above it.

Tags:

Comments

Regarding rearranging the metadata - they can't be rearranged with CSS because they're all in one container div, so I had a look at the source code - unfortunately, they are read automatically from $.metadata, which appears to be a preset thing, so it would be very difficult to rearrange the order in which they are printed(i.e. the order they appear within $.metadata). For the moment, I can't see a clear way to do this other than to perhaps write some kind of loop into the function to rearrange their order as they are read from $.metadata. This would be tricky - if you really want this done, I may be able to hack something together with a bit of work.

I was looking at this too, but didn't want to jump on it because I thought I was wrong. =) I looked in several different journal styles, and it seems to me that the foreach operator pulls the keys out alphabetically, because they all go [Location; Mood; Music]. I can't find anywhere how $.metadata is stored.

Any idea about the CSS thing? .user-icon{width:100%;} works sideways, but height:100% doesn't, and I've tried every combination of classes I can think of. .user-icon{height:nnnpx;} will extend the block downwards, but you can't vary the number automatically.

No, it's a nuisance. I was trying the height: 100%; trick, but that only has an effect with position: absolute. It also means 100% of the page, annoyingly, not the container div, which doesn't seem logical. It doesn't work with position: relative. Plus, the text of the entry ends up underneath it. Float doesn't work either, and I'm reluctant to advise using it because IE doesn't do float, as I have found out with my own journal. I use Firefox, so I'm keeping my float!

When it comes down to it, the problem is that the userpic is a div within the entry div, and the text of the entry (and all the other bits and pieces) and within the entry div, not their own div. It could probably be worked around by creating a new div for the text and having it and the userpic div next to each other, but it would be tricky, and might require the troublesome float. Plus it would mean altering the source code, which may not be as straightforward as I think - I'll need to look up the function in question.

So, is there any solution to this issue of "fixing" the alignment of entries so that it doesn't shift over to the left under the user icon? I've seen some people's LJs where it's been fixed but I don't think I've ever seen an answer to this in this community.