How to make logo appear on smaller screens

cemsdb

How does one make the logo appear for (all) screens smaller than 760px?

saguaros

I guess you want to show the logo in the middle too so try this custom css code:

@media (max-width: 767.98px){
.t4-vertical-nav .h-nav-middle {
    display: block !important;
    order: 2;
}
.t4-vertical-nav .h-nav-top {order: 1;}
.t4-vertical-nav .h-nav-bottom {order: 3;}
}

cemsdb

saguaros Hi Saguaros, it's not really about putting the logo in the middle. It seems the issue (invisible logo) only occurs in the homepage. How do I get the homepage to show the logo as the rest of the pages do (logo on the left hand side, while the menu appears on the right side)?

saguaros

Your logo is showing now on homepage, could you clear your browser's cache?

cemsdb

saguaros I see the logo in the homepage, but it's centered (barely). I would like the logo to be on the left side corner and the menu on the right side corner, like all the other pages.

saguaros

cemsdb

It depends on the layout, on the homepage of your site, you use ja_seven - Home 3 template style while other pages use other layouts so it must look different.

If you want it looks the same layout, you need to change in Layout settings of template.

cemsdb

saguaros Hi Saguaros, your last response is somewhat confusing as the website is now working properly (logo on left, menu on right), yet the Layout remains on 'ja_seven - Home 3.' Upon further investigation I can see the current CSS code is different from the one you posted above, as such:

@media (max-width: 767.98px) {
.t4-vertical-nav .h-nav-middle {
display: block !important;
}
.t4-vertical-nav .h-nav-top {padding-left: 240px;}
}

To clarify for other Joomlart members, is the solution the code above? Or the previously suggested code along with the layout change?

saguaros

That custom css code helps to show the logo on the left as you want, could you check it now?