Creative Header: problem with vertical logo and responsive menù

Web-elettronica · February 2016

Hi,

in our test site we have a visualization/responsive problem when we use the creative header (always open) and a vertical bigger logo than the normal size.

Here you can see the site: http://rrgroup.web-elettronica.eu/

Here there is my custom CSS:

---------------------------------------------------------------

@media only screen and (min-width: 400px) {

#Top_bar #logo { height : 491px !important;}

}

---------------------------------------------------------------

I see the responsive problem around the iPad size of the screen (1024x768 and 768x1024) and near the 480x640 size. I think is an error because i can't find the correct rules in my custom CSS. My idea is to have "the left column" menù with the bigger logo when the device is bigger, and when is small i want the normal responsive meù. Is it possible? Are there another best solution?

Thanks a lot...

Albert · February 2016

Hi,

the only solution we have is to increase value for min-width in above css. This is the only solution we got in this case.

Web-elettronica · February 2016

Ok, thanks so i'm in the correct way to resolve it.

I think that the first rule doesn't work well with the second independently of the min-width... try to see my link in this site http://mattkersley.com/responsive/ or try to play with the small/bigger windows in you browser, so you can see the error ... i think, the second rule is always active, also with the "small/responsive" menù, because i see the first part of the page very very under the menù.

But, there isnt' another solution to have a bigger vertical logo?

Albert · February 2016

We know what you mean very well but like we wrote, you need to increase the value of min-width attribute. Instead of 400px, set 1024px for example or even larger screens if this won't be enough. Except that, we do not have other solution as any other will requires files customization.

Web-elettronica · February 2016

Ok, thanks... maybe i have another solutions...

Now i have insert the logo inside the first slot of the "left" menù, and work well...

After i have insert this rule in my custom CSS:

-----------------------------------------

@media only screen and (min-width: 1240px) {

.logo { display: none !important; }

}

-----------------------------------------

So, in the bigger screen i see the logo thanks the principal menù (with the special rule i hide)... and in the smaller screen i see the logo that i insert in the be theme options...

I have wrote this solution so somebody else can use it...

What do you think?

Albert · February 2016

If it works as you expect it means that your solution is good

Web-elettronica · February 2016

Ok, thanks for the support! ^:)^

Albert · February 2016

No problem.

Creative Header: problem with vertical logo and responsive menù

Comments

This website uses cookies