Forum Title Positioning

For support and discussion related to templates, themes, and imagesets in phpBB 3.1.
Ideas Centre
Locked
SteStory
Registered User
Posts: 19
Joined: Wed Apr 08, 2015 6:21 pm

Forum Title Positioning

Post by SteStory » Wed Apr 08, 2015 9:09 pm

http://barrowafc.net/index.php

Can anyone suggest the line of code I need to edit to make each individual forum and description to line up in the centre of the row.

Ie: where it says Barrow AFC, All things Barrow AFC. I'd like it aligned vertically with the middle of that row, whereas now it's to the top, so looks off compared to the icon to the left.

The Pre-Match travel one looks fine because there's another line for the moderator, but the rest look off to my OCD eye!

Cheers
Ste

User avatar
Rahber
Former Team Member
Posts: 2720
Joined: Tue Feb 12, 2008 3:39 pm
Location: Pakistan
Name: Rahber
Contact:

Re: Forum Title Positioning

Post by Rahber » Thu Apr 09, 2015 9:15 am

try adding this to your CSS and adjust the margin value as required.

Code: Select all

dl.icon dt, dl.icon dd {
  margin-top: 10px;
}

SteStory
Registered User
Posts: 19
Joined: Wed Apr 08, 2015 6:21 pm

Re: Forum Title Positioning

Post by SteStory » Thu Apr 09, 2015 4:38 pm

Aii, I tried that initially. It helps slightly, but it also makes the blue bar at the top go bigger which doesn't look too nice :(

User avatar
javiexin
Code Contributor
Posts: 1157
Joined: Wed Oct 12, 2011 11:46 pm
Location: Madrid, Spain
Name: Javier
Contact:

Re: Forum Title Positioning

Post by javiexin » Thu Apr 09, 2015 6:32 pm

The way I found worked best in my browser -Firefox- (you should test on more) is:

Code: Select all

dl.icon dt, dl.icon dd {
    position: sticky;
    top: 50%;
    transform: translateY(-50%);
}
But this creates a problem: there are some <dfn> tags that are supposed to be out of the screen (ie, not visible) but now are in the middle of the presentation area. I don't know how to achieve the same effect without the issue of having the <dfn> tags show up (Last post, Topics, Posts labels appear...).

You fix it by adding:

Code: Select all

ul.topiclist dfn {
    display: none;
}
But then, I don't know what may be broken by these changes! You will have to test it, and someone (that knows much better than I do) should advise what are these tags for, and what are you going to miss if you make them "display: none". Apparently, these changes also work on "responsive" widths, but as I said, you should check them!

Hope this helped,
-javiexin

SteStory
Registered User
Posts: 19
Joined: Wed Apr 08, 2015 6:21 pm

Re: Forum Title Positioning

Post by SteStory » Sat Apr 11, 2015 12:10 pm

That didn't seem to work for me.

Anyone else got a suggestion? For someone with my OCD this tiny little thing really does ruin a wonderful upgrade :(

User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: Forum Title Positioning

Post by Arty » Sat Apr 11, 2015 12:53 pm

Best thing you can do is remove moderators list from second forum, so all forums would have only title + one line description, then add padding-top: 10px; to dl.icon dt .list-inner

Doing it properly is not possible because its not possible to vertically center static elements that aren't contents of table cell.
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework

Locked

Return to “[3.1.x] Styles Support & Discussion”