Support Center Visit Demo License manager Buy @ envato

Creative Header: problem with vertical logo and responsive menù

Web-elettronicaWeb-elettronica
in Menu / Mega menu

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...


Comments

  • AlbertAlbert
    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.
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • Web-elettronicaWeb-elettronica
    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?
  • AlbertAlbert
    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.
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • Web-elettronicaWeb-elettronica
    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? 
  • AlbertAlbert
    If it works as you expect it means that your solution is good :)
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • Web-elettronicaWeb-elettronica
    Ok, thanks for the support!  ^:)^
  • AlbertAlbert
    No problem.
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
Sign In or Register to comment.