Joomla Templates Club 406,261 posts

[Andy Fernandez Friend Andy FernandezJoin date: September 2015Posts: 52Downloads:13Uploads:35 Thanks: 18 Thanked: 1 times in 1 posts]

#971880

I found a problem when it comes to the responsive layout. I guess the logo drops to the top of the menu and makes the Header div too big and its impossible to click on content. Is there any way to hide it under the responsive layout?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#971936

Hi
Its because you are using a static style for the logo text in custom.css file

.logo-text .site-slogan {
    font-size: 24px!important;
    margin-top: -5px!important;
    color: #039be5 !important;
}

You can apply different style for different screen size using media queries .
Here is a doc.

[Andy Fernandez Friend Andy FernandezJoin date: September 2015Posts: 52Downloads:13Uploads:35 Thanks: 18 Thanked: 1 times in 1 posts]

#972002

Sorry, this is new to me. Where are these queries located?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#972003

Hi
You can see the example in the Documentation links above .
Here is an example :

@media screen (max-width:468px) {
.logo-text .site-slogan {
    font-size: 14px!important;
    margin-top: -5px!important;
    color: #039be5 !important;
}}

When u add this code in custom.css file , it will affect when the screen size is max. 468px , this way you can apply the different style code for different screen sizes .

[Author]

Posts