Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • April 7, 2018 at 4:19 pm #938623
    Ralf_M

    Hi guys,
    I found that Documentation here to add a widget to the header area.
    I tried it and I see it now, even when it is on the left end of the header. It seems that I cannot move it more to the right. It ends where the menu begins. But all I want is this widget header in one single line above the main menu.
    I would also like to have that main menu a little bit lower so that I can put more text up there if needed.
    All that should of course work on smaller screens also.
    Hope you can help me out with this.

    Thanks a lot in advance.

    April 7, 2018 at 8:48 pm #938661
    Ralf_M

    Hi guys,
    today I was more successful with it than yesterday. I got almost all working. Only the focus of the main menu is below itself. Don’t know which selector to use …

    Please help me to fix that.
    Thanks.

    • This reply was modified 6 years, 7 months ago by Ralf_M.
    April 8, 2018 at 8:32 am #938723
    Rikard

    Hi Ralf,

    Thanks for the feedback. I’m not sure what you mean by this though?

    the focus of the main menu is below itself

    Could you try to clarify please?

    Best regards,
    Rikard

    April 8, 2018 at 11:06 am #938759
    Ralf_M

    Hi Rikard,
    thank you for answering. Sorry that I was not clear enough.
    The problem is: when you try to click the menu, the pointer doesn’t change to the click-symbol and you can not click the menu entry. You have to go a bit below the menu and there the cursor changes and you can click. So the click-area is out of focus of the menu.
    Hopefully that makes it clearer.

    April 9, 2018 at 5:36 am #938939
    Rikard

    Hi Ralf,

    Thanks for the clarification, please try this in Quick CSS:

    #custom_html-4 {
  padding:0 !important;
}

    Best regards,
    Rikard

    April 9, 2018 at 8:35 am #939005
    Ralf_M

    Hi Rikard,
    I tried, it didn’t change a bit …

    April 9, 2018 at 1:32 pm #939163
    Rikard

    Hi Ralf,

    Thanks for the feedback. Please try this instead:

    #header .widget {
  padding:0 !important;
}

    Best regards,
    Rikard

    April 9, 2018 at 1:34 pm #939165
    Ralf_M

    Sorry Rikard,
    this also doesn’t change a thing. I let it in there, so you can try,
    Thanks.

    • This reply was modified 6 years, 7 months ago by Ralf_M.
    April 10, 2018 at 4:38 am #939547
    Rikard

    Hi Ralf,

    Thanks for that. You have placed it inside a media query, which is not closed either:

    @media only screen and (max-width: 990px) {
#menu-item-search {
    position: absolute;
    top: -30px;
    left: -50px;
}
#header .widget {
visibility: hidden;
}
#header .widget {
  padding:0 !important;
}

    Try closing the query first:

    @media only screen and (max-width: 990px) {
#menu-item-search {
    position: absolute;
    top: -30px;
    left: -50px;
}
}

    Then you can add the rest of the CSS:

    #header .widget {
visibility: hidden;
}
#header .widget {
  padding:0 !important;
}

    I’m not sure why you have this though, what is it supposed to do?

    #header .widget {
visibility: hidden;
}

    Best regards,
    Rikard

    April 10, 2018 at 4:39 am #939549
    Rikard

    Hi again Ralf,

    If the CSS I sent should still not be working after that then please try placing it at the top of Quick CSS, it should work then.

    Best regards,
    Rikard

    April 10, 2018 at 8:58 am #939718
    Ralf_M

    Hey Rikard,
    that did it. You are right, this should not be within another query.
    The one you are asking is hiding the Menu-Bar-Widget on smaller screens (there is not enough place for it).

    Thanks a lot! You are great!
    This can be closed now.

    April 10, 2018 at 11:09 am #939777
    Victoria

    Hi Ralf_M,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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