Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • November 19, 2014 at 11:12 am #353541
    activemindneudenken

    Hi guys,
    I searched a lot in the support threads but coudn’t find answers to the following:

    1) Is it possible to make the header sticky on mobile devices respectively below the breakpoint for the mobile menu?

    2) Is it possible to adjust the breakpoint for the mobile menu (besides the fixed option in the template admin tab)? I would like to have the “normal” menu as long as possible, but if you resize the browser, menu overlaps the logo: http://neudenken.org/test01/

    3) How to remove the underlining of links in main content and widget areas? I tried this in the qucik CSS: 

    a:link { text-decoration:none; }
a:visited { text-decoration:none; }
a:focus { text-decoration:none; }
a:hover { text-decoration:none; }
a:active { text-decoration:none; }

    but it didn’t work out.

    4) How to avoid the linked image overlay?

    5) Last not least: It would be a great feature, if one could create/select a different menu for the mobile version.

    Thanks for your help!
    Felix

    November 19, 2014 at 5:11 pm #353797
    Josue

    Hi Felix!

    1. Add this to Quick CSS:

    .responsive #top #wrap_all #header {
    position: fixed;
}

    2. Try with the following code (it will reduce the padding and font-size at the given screen width):

    @media only screen and (max-width: 989px) {
.responsive .main_menu ul:first-child > li > a{
    font-size: 12px;
    padding: 0 6px;
}
}

    3. I’m not noting any underline in the links of your page.

    4. Add this to Quick CSS:

    .image-overlay{
display: none !important;
}

    5. There is a way to do this, simply put all menu items in the same menu but add the class of “noMobile” to the ones you don’t want in the mobile menu.

    Regards,
    Josue

    November 24, 2014 at 9:40 pm #357133
    activemindneudenken

    Hi Jusue,
    great help, thank you. 2 + 4) works perfectly, thanks: For 3) I found a solution.

    But not everything worked out: 1) it works partly, the header is sticky also on mobile devices. But is also “swallos” the upper part of the page (just when the mobile header is active). But his means, page title or whatever is there is hidden behind the header. See: http://neudenken.org/test01/

    Would be great if you can help me with this…

    Best and thank you again,
    Felix

    November 25, 2014 at 5:17 am #357333
    Josue

    Hey Felix!

    Try adding this code to the Quick CSS:

    @media only screen and (max-width: 767px) {
.responsive #top #main {
    padding-top: 88px !important;
}

    Cheers! 
    Josue

    November 25, 2014 at 9:55 am #357424
    activemindneudenken

    Hi Josue,
    thanks again for your quick response. The solution works, but a conflict with the resizing of the menu appears. CSS for the header behaviour is now: 

    .responsive #top #wrap_all #header {
    position: fixed;
}

@media only screen and (max-width: 767px) { .responsive #top #main {
    padding-top: 88px !important;
}

@media only screen and (max-width: 989px) {
.responsive .main_menu ul:first-child > li > a{
    font-size: 12px;
    padding: 0 6px;
}
}

    Second and third command do not work together, the menu doesn’t resize anymore when I add the top-padding.
    Sorry to bother you again. You offer a really great service!
    Best, Felix

    November 25, 2014 at 10:52 am #357443
    Josue

    Hey Felix!

    It should be like this:

    .responsive #top #wrap_all #header {
    position: fixed;
}

@media only screen and (max-width: 767px) { 
.responsive #top #main {
    padding-top: 88px !important;
}
}

@media only screen and (max-width: 989px) {
.responsive .main_menu ul:first-child > li > a{
    font-size: 12px;
    padding: 0 6px;
}
}

    Best regards,
    Josue

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