Viewing 6 posts - 31 through 36 (of 36 total)
  • Author
    Posts
  • #464788

    yes its everything ok but your menu is a “little” wider than that on my example page

    you have to change the media query option :

    @media only screen and (max-width: 1150px)  {
    #top #header_main > .container,#top #header_mai     
    etc pp
    

    to the max-width 1650px (this depends on how wide is your navigation and how big is your slogan – so play with it)

    and don’t forget to make that one setting more specific to the header else the whole site content is at 100%

    https://kriesi.at/support/topic/make-mobile-version-more-user-friendly/#post-464661

    webers-testseite.de/enf01

    after that you can style the menu which moves beneath the logo

    • This reply was modified 9 years, 6 months ago by Guenni007.
    #464800

    i found a very similar font at google :

    https://www.google.com/fonts/specimen/Architects+Daughter

    have a look even on my test page

    #464985

    Guenni007,
    another surprising change after inserting max-width 1650px!
    The header even in the PC version now shows logo, tagline and menu underneath each other … but unfortunately that’s not what the client wants. She only wants this for the mobile version.

    Also, how do I make this setting specific (100%) just for the header, not for the whole content?

    After all your efforts, I feel I shouldn’t challenge you any more. I’m not a programmer so I cannot be “inventive” or play around with code like you. But I’m very grateful for your patient support!

    #465051

    and what do you want to make with your long navigation and a big logo with long slogan ?
    underneath the 1650px they will overlap

    do you realy read all the instructions or is it my bad english that sometimes some instructions are lost ?

    this code here:

    .responsive #top #wrap_all #header_main .container {
    float:none;
    max-width:100%;
    padding-left:0;
    padding-right:0;
    width:100%;
    margin:0 auto
    }

    has to be inserted instead of :

    .responsive #top #wrap_all .container {
    float:none;
    max-width:100%;
    padding-left:0;
    padding-right:0;
    width:100%;
    margin:0 auto
    }

    you see the difference : now only the container after #header_main is selected

    • This reply was modified 9 years, 6 months ago by Guenni007.
    #465070

    That did the trick, Guenni, the main container is now styled again.
    You’re right about the too large header – I’ll have to discuss it with the client what she thinks about this solution – which is great for the mobile, too!

    Thank you so much!
    Susanne

    #465474

    Hi!

    Great, please let us know if you should need any further help :)

    Best regards,
    Rikard

Viewing 6 posts - 31 through 36 (of 36 total)
  • You must be logged in to reply to this topic.