[Resolved] Edit the space in the top bar between the widgets

Home Forums Support Edit the space in the top bar between the widgets

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1617565
    Artem

    Hi,

    I have added 3 html widgets to my top bar. Now I’d like to ad more space in between them.

    Also is there a way to make the 3 widgets stick on the same line on mobile?

    Here is how I want them to be positioned:

    https://ibb.co/m6013sv

    Hope you can help me out πŸ™‚

    Thanks you!

    #1617605
    Ying
    Customer Support

    Hi Artem,

    The 3 widgets are not in the same line on mobile because there’s not enough space. You could try to reduce the font size and remove the padding left& right of the widgets. Try this CSS:

    @media (max-width: 768px) {
        .inside-top-bar.grid-container {
            font-size: 11px;
            padding-left: 0;
            padding-right: 0;
        }
    }

    To add space between widges on desktop, try this CSS:

    @media (min-width: 769px) {
        .top-bar .inside-top-bar {
            justify-content: space-around;
        }
    }

    Let me know πŸ™‚

    #1618180
    Artem

    Hi thanks for the reply. The first code did work it looks now better on mobile and is within one line. However the second code did not work.

    I have added the second code just like you have posted it above.

    #1618346
    David
    Staff
    Customer Support

    Hi there,

    try this CSS:

    @media (min-width: 769px) {
      .top-bar .inside-top-bar {
          justify-content: space-around;
      }
      .top-bar-align-center .widget:first-child {
        margin-left: unset;
      }
      .top-bar-align-center .widget:last-child {
          margin-right: unset;
      }
    }
    #1618619
    Artem

    Thanks David it worked like magic!!! There is nothing you can not do. I’m amazed!

    #1618692
    David
    Staff
    Customer Support

    Glad we could be of help

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