Docs

[btraven]

Dear Support Team,

me again:)

I am experiencing a Scrolling problem when adding the “individual menu – widget” to the header (triangle link on the top right side)
See attached file!

I would like to display all pages but the scrolling down does not work at all.

Unfortunately I cannot provide any Details since I am on localhost.

Do you have an idea anyway?
Thanky so much!

[Lely]

Hello There,

Thanks for posting in.
Please note the Header Widget height is fixed in position. It’s content height is limited to your browser screen height because it sits on top of your main content. The scrollbar by default will not work on this. We can add the following CSS to add scrollbar on Header Widget content but it is not recommended.

.x-widgetbar {
    overflow-y: scroll;
    max-height: 100%;
}

Hope this helps.

[btraven]

THX for the response.

That code didn’t work well.
Maybe we can align the page links horizontally, or in columns?

[Rue Nel]

Hello There,

The code should have work. Unless otherwise there are other css that may have in conflict with the code. If you want to display the menu links in horizontal order, please use this code:

@media(min-width: 980px){
    .x-widgetbar .menu li {
        display: inline-block;
        padding: 3px 10px;
    }
}

http://prntscr.com/bkdohd

Hope this helps.

[btraven]

Nice!
This looks way better.
What css should I add to have that same effect on mobile view?

Thank you.

It looks like you’re working in the middle of the night!
Therefore, I don’t expect an answere right away.

Thank you so much for your support!

[Lely]

Hi There,

Please update above CSS to this:

    .x-widgetbar .menu li {
        display: inline-block;
        padding: 3px 10px;
    }

Hope this helps.

[Author]

Posts