Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • June 18, 2020 at 8:11 am #1223611
    emilconsor

    Hi,
    is it possible to use the tab section not as a full width element and inside of a container?
    On this page you can see the tab section and a tab content element: see private content
    The problem is that we cannot use content elements in the tab element like in the tab section and its very laborious to change content like a table when its inserted as a shortcode.

    Is there any solution for this to use a tab section not as full width element or to edit shortcodes inside a tab content element?

    Thanks in advance,
    Sebastian

    June 19, 2020 at 6:55 pm #1224127
    Victoria

    Hey emilconsor,

    Could you please attach a mockup of what you’re trying to achieve?

    Best regards,
    Victoria

    June 22, 2020 at 8:15 am #1224501
    emilconsor

    Hi Victoria,
    check out this link: https://imgur.com/a/hAzLXjs
    You can see this layout also by clicking the link from my last mail.
    We want to have a tabbed layout in which we can use content elements like a table, images… unfortunately its not possible so far to use a tab section in a container… this would solve all our problems.
    When we use the tab element we can inset tables but this cant be edited after.
    Hope this gets clearer now.
    Thank so far,
    Sebastian

    June 24, 2020 at 1:37 pm #1225183
    Victoria

    Hi Sebastian,

    Well, you can try this css, but it’s a complex layout and this might not give you the desired result:

    
#av-tab-section-1,
.av-tab-section-outer-container,
#top .av-layout-tab {
  width: 80vw;
}

    Best regards,
    Victoria

    June 24, 2020 at 1:48 pm #1225190
    emilconsor

    Hi Victoria,

    Unfortunately, that doesn’t work.

    The Tab Content Containers are larger than the wrapper and inside content elements get cut off.

    View post on imgur.com

    We’ve tryed to fix this with custom css but it seems not to work.

    Any other solutions?
    Thanks so far!

    Best Regards,
    Sebastian

    June 27, 2020 at 3:00 pm #1226052
    Victoria

    Hi Sebastian,

    I am not aware of such an option. Tab sections are built as a full-width element and so it’s not changed so easily.

    Best regards,
    Victoria

    June 27, 2020 at 3:00 pm #1226053
    Victoria

    Hi Sebastian,

    I am not aware of such an option. Tab sections are built as a full-width element and so it’s not changed so easily.

    Best regards,
    Victoria

    June 12, 2021 at 6:28 pm #1305413
    namgyal

    This CSS worked for me ! Do change the page-id number:

    .page-id-123 .av-tab-section-outer-container {
    background: #ffffff;
    margin-left: 10%;
    margin-right: 10%;
    }

    .page-id-123 .av-layout-tab-inner {
    margin-right: 20% !important;
    margin-left: 0% !important;
    }

    June 14, 2021 at 8:40 am #1305552
    Rikard

    Hi namgyal,

    Thanks for sharing, it’s much appreciated :-)

    Best regards,
    Rikard

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