Menu Item Article Categories Section CSS Bug

ThePieMonster

I wanted to report a bug in regards to the /html/body/div[2]/div/div/div[2] section. It has a issue when viewing a menu item that display article catagories. The start of the page is up higher than it should be. If you uncheck the -150px margin in DevTools as shown in the second screenshot, the start of the content will be starting at the "green" line where the rest of articles start their content.

The demo site has this issue you can log in and see for yourself.

PHP 7.4

saguaros

Hi ThePieMonster

It due to this style in template:

div#t4-header + #t4-hero, 
div#t4-header + #t4-masthead {
	margin-top: -150px; }

It adds margin-top for pages which have Hero + Masthead section. You can override this value so suit your need.

ThePieMonster

saguaros

Adding the below code did fix the Filters page, but this causes a issue with the main home page as shown below.

div#t4-header+#t4-hero, div#t4-header+#t4-masthead {
	margin-top: 0px;
}

saguaros

ThePieMonster It looks fine now, could you clear browser's cache and check again?

ThePieMonster

saguaros Yes it is still there. Take a look at the custom.css file if you want to make a change, or edit live using Chrome DevTools. Pages to check are the /index.php page and the /index.php/albums/misc page.

saguaros

Hi ThePieMonster

I updated the page class for that misc page, kindly check.

ThePieMonster

saguaros What / Where exactly did you make the edit? Also will this apply to every filter (article category) page or just this single page?

saguaros

ThePieMonster I added 'misc' page class under Misc menu item, then edit above css in custom.css file

You have this issue on other page also? kindly share the URL so I can check.

ThePieMonster

saguaros

Thanks I will add that class to the other menu items in the future. For reference below, I changed the class name to catagory_list.

/*
Prevents article heading from starting at top of window
IE: margin-top: -150px;
*/
.catagory_list div#t4-header+#t4-hero,.catagory_list div#t4-header+#t4-masthead {
	margin-top: 0px;
}

/Thread Closed