Combining Row Height and Font Size in UserChrome.css

[TxCowboyDancer]

Hi there,

I've been reading the various articles here (THANK YOU!) however... I've run into a problem.

I want to combine two adjustments in the userChrome.css file but one seems to override the other.

I want to use this to put more space between the rows in the message list and to put a horizontal line between messages in the message list:

/* Add solid or dashed to Message pane */
#threadTree treechildren:-moz-tree-row {
border-bottom: 2px solid #D3D3D3 !important; }

/* Adjust Thread pane message row height */
#threadTree treechildren:-moz-tree-row {
height: 30px !important;
}

Which works fine. However, when I add this:

/* Global UI font */
* { font-size: 12pt !important;
font-family: Verdana !important;
}

The change to the row height gets overridden.

I've used the Theme Font & Size Changer to change the font size and the result is the same. The font does indeed increase in size however the row height modification gets ignored.

Any suggestions on how to do both? Thanks!

[TxCowboyDancer]

I found the solution:

I also found out how to adjust the row height in the Folder Pane. Here is the set of codes that I eventually used:

/* Add solid, dotted, or dashed to Message pane */
#threadTree treechildren:-moz-tree-row {
border-bottom: 2px dotted #D3D3D3 !important;
}

/* Adjust Thread pane message row height */
#threadTree treechildren:-moz-tree-row {
height: 36px !important;
}

/* Change the font of ALL trees */
treechildren {
font-size: 14px; font-family: Verdana;
}

/* Adjust Thread pane message row height */
#folderTree treechildren::-moz-tree-row {
height: 24px !important;
}