Changing Line Spacing…

[lilaliend]

Hello,
I'm fairly new to adium styles and am trying to edit one of them. I understand HTML and CSS a pretty good deal, but for the life of me can't figure this one out.

I want to take the justtext style and add a little more line spacing. I wanted to use Gill Sans Light as the font, but when I use 12 pt it cuts off the top of the capitol letters. I'm forced to then use 11 pt which is a bit to small w/ this font.

Any help would be greatly appreciated. Thanks.

[riot]

Add this to the body section of your css, altering it to your specification:

line-height: 15px

EDIT: I'm also new to this so I'm not sure which exact css file you'll need to add it to.

[Perez]

You should be able to change the font either in main.css or in the message preferences. In main.css, you'd add/change:

Code: Select all

body {
     font-family: "Gill Sans Light";
}

You may also want to add a fall-back, like { font-family: "Gill Sans Light", sans-serif; }. If you want only the message text, and not (for example) the timestamps, you could use .message (I think) for the selector. You probably want to add line-height to the body selector, or it'll look weird / not work out right.

[riot]

What are the " " for around the font selection? Is that something to do with Adium?

[zaudragon]

What are the " " for around the font selection? Is that something to do with Adium?

Nope. You need them for multiple words.

[lilaliend]

Line height part didn't work

I can change the font no problem. It's just that when I use it at 12 pt it cuts off the tops of capitol letters, so I need to adjust the spacing between each line.

[/img]

[shanecavanaugh]

In main.css you'll see this

Code: Select all

.contextmessage {
     color: #666;
}

Change that to this:

Code: Select all

.contextmessage {
     color: #666;
     margin-bottom: 3px;
}

That should do it.

[Perez]

Code: Select all

.contextmessage {
     color: #666;
     margin-bottom: 3px;
}

That should do it.

Actually, I think you want a different selector (assuming the HTML's similar in this mod to how it was when I wrote it). Margin may be a better route to go than line-height, though (or you might want both). The HTML looks like this:

Code: Select all

<div class="incoming">
    <span class="contexttime">%time% : </span>
    <span class="contextsender">%sender% : </span>
    <span class="contextmessage">%message%</span>
</div>
<div class="incoming">
    <span class="time">%time% : </span>
    <span class="message">%message%</span>
</div>
<div id="insert"></div>

So to get spaces between the parts that are overlapping, you need to include names, not just messages (and not just context messages, which are the history). If long messages that wrap around run into themselves, you'll want to be sure to get all the individual bits; since they're all in <span> elements, you can do that like this:

Code: Select all

span {
     margin-bottom: 3px;
     /* or try line-height: 14pt; or something */
}

However, if messages that wrap don't interfere, you can just apply the extra spacing to messages at large, like this:

Code: Select all

.incoming, .outgoing {
     margin-bottom: 3px;
     /* or try line-height: 14pt; or something */
}

[shanecavanaugh]

You're right. That last one would be the best option, I think.

[lilaliend]

That last one did the job, "line-height".

Thank you VERY much.