phpBB 3.1: prosilver Forum Heights

I like some of the new additional features in the phpBB 3.1 branch, but I personally am not a big fan of the way forum tables are styled. In the 3.0 branch, I used a mod to display the last post subject on the board index, but this was a feature included in 3.1 by default. Whereas a lot of people seemed to hate how wide the last post column was in prosilver for 3.0, it worked out well for me, because it made sure I had plenty of space to accommodate the text for the post subject – as well as to include the poster’s name, moved to the line with the time-stamp, without having to break to a third line. That made it possible to keep the rows narrow and, in my opinion, more appealing.

Well, I’m admittedly not very educated when it comes to styling or using CSS, so I really couldn’t determine how to make the changes to the prosilver style in 3.1 to have the same width distribution as it had in 3.0. I didn’t want to blindly tinker too much either, just in case any changes I might make would create issue with other elements in the board’s style. But what I thought was worth doing, and should have been done by the style team anyway, was to just set a minimum height for the rows. The reason I think this is worth doing, and should have been done by the phpBB style team by default, is because it is extremely ugly, in my opinion, to see the typical narrow forum rows for forums that have no posts, and then see the expanded rows for the forums that do have post info. If nothing else, it should have been consistent.

I found that the height of forums that have posts in them tend to be 50px after accommodating for the subject, author and time-stamp. So, I simply made that small change to those forum table styles to make it so that they were always a minimum of 50px in height. The colours.css file in the style’s theme folder is the one that holds these settings.

If you want to make this change, just open colours.css and find the following lines:

.forum_link			{ background-image: url("./images/forum_link.gif"); }
.forum_read			{ background-image: url("./images/forum_read.gif"); }
.forum_read_locked		{ background-image: url("./images/forum_read_locked.gif"); }
.forum_read_subforum		{ background-image: url("./images/forum_read_subforum.gif"); }
.forum_unread			{ background-image: url("./images/forum_unread.gif"); }
.forum_unread_locked		{ background-image: url("./images/forum_unread_locked.gif"); }
.forum_unread_subforum		{ background-image: url("./images/forum_unread_subforum.gif"); }

And just define a minimum height for each one with min-height: 50px;.

.forum_link			{ background-image: url("./images/forum_link.gif"); min-height: 50px; }
.forum_read			{ background-image: url("./images/forum_read.gif"); min-height: 50px; }
.forum_read_locked		{ background-image: url("./images/forum_read_locked.gif"); min-height: 50px; }
.forum_read_subforum		{ background-image: url("./images/forum_read_subforum.gif"); min-height: 50px; }
.forum_unread			{ background-image: url("./images/forum_unread.gif"); min-height: 50px; }
.forum_unread_locked		{ background-image: url("./images/forum_unread_locked.gif"); min-height: 50px; }
.forum_unread_subforum		{ background-image: url("./images/forum_unread_subforum.gif"); min-height: 50px; }

Now all rows displaying forum names and post information will have the same height, whether they have a post to display information for or not.

Note that you may have to purge your forum’s cache from the ACP after making the changes.