Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • March 11, 2019 at 10:09 pm #1077512
    jgdoyle1

    Hello,

    I’m seeing an issue with a tab section wrapping strangely on mobile devices. I’ve placed the URL in the Private Content.

    There are 3 tabs sections on the home page (in blue). The first section has 6 tabs, the second 3, and the third tab section has 5. When I view these sections on a mobile device (iPhone 7/vertical orientation) the tab section with 3 tabs has a line break whereas the other two tab sections do not have a line break. That seems strange because this tab section only has 3 tabs. I don’t want the tabs sections to have a line breaks. Any ideas?

    Thank you for your help. (image attached)
    John
    Tab sections with line break on mobile

    March 13, 2019 at 6:54 pm #1078334
    Victoria

    Hey jgdoyle1,

    Best regards,
    Victoria

    March 13, 2019 at 11:04 pm #1078430
    jgdoyle1

    Hello. You’re looking at the wrong tab section. That one works fine. It’s the blue tab section below the title “Transcendence Through Connection”. The first tab is labeled “Playshops & Collaborations”.

    I’m using an iPhone 7 in vertical mode.

    Thanks.
    John

    March 19, 2019 at 3:18 am #1080179
    Ismael

    Hi,

    Thank you for the update.

    We can’t reproduce the issue on our end. Maybe, the tab title container is not resizing properly, so this css code might help.

    .page-id-330 #av-tab-section-2 .av-tab-section-tab-title-container {
    min-width: 431px !important;
}

    It will adjust the width of the main tab title container. It might be necessary to turn on the custom css class attribute so that you can define a unique selector for that element.

    // https://kriesi.at/documentation/enfold/intro-to-layout-builder/#turn-on-custom-css-class-field-for-all-alb-elements

    Best regards,
    Ismael

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