Help with tabs layout

  • FunkyCss
    August 27, 2026 at 6:13 am

    Hi there,

    I have a design that I need to recreate — this one: https://ibb.co/KpQwpV6g

    It’s essentially a headline with a border around it, with tabs at the end.

    I’ve created the headline and border using a Flex Row, as you can see here: https://ibb.co/0y2DdNKL

    My only issue is that I’m not sure how to add the query/content below it.

    Ideally, I’d like the layout to be:

    **Row:** Headline → Border → Tabs
    **Below the row:** Query/content

    I’ve also shared the website and the current setup in the hidden info.

    Thanks in advance!

  • Ying
    August 27, 2026 at 8:19 am

    Hi there,

    Try this CSS:

    @media(min-width: 769px) { 
.gb-tabs__menu.gb-tabs__menu-48737e2a:before {
    content:'Our Signatures';
    margin-right: auto;
    font-size: 30px;
    order: -2;
}

.gb-tabs__menu.gb-tabs__menu-48737e2a:after {
    content: '';
    border-top: 2px solid var(--base);
    width: auto;
    flex-grow: 1;
    order: -1;
    margin-top: 20px;
    margin-inline: 20px;
}
}
  • FunkyCss
    August 31, 2026 at 9:33 pm

    Hi there, this is actually great solution. Thank you very much.

  • Ying
    September 1, 2026 at 6:08 am

    You are welcome   🙂

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