Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 28, 2021 at 6:19 pm #1313088
    julhobart

    Hi! I would like to format the tabs so the active tab has a thick blue line underneath it and the non active tabs do not have a line underneath. Can you help me with the code for this?

    Also, I have removed the border from the titles and the content but would like a border across the top and bottom of the content but not the sides. Please help.

    Finally, I have a gallery where I’d like to remove the thin border around all the images. I was able to remove it from the thumbnails but not the main image.

    Thanks!

    August 1, 2021 at 4:42 am #1313649
    Rikard

    Hey julhobart,

    Sorry for the late reply. The page you linked to has htaccess protection, could you share details in private, so that we can view it please?

    Best regards,
    Rikard

    August 31, 2021 at 7:04 pm #1319229
    julhobart

    Hi, I was able to figure this out but would also like to apply the settings to a mobile screen. For smaller screens, I’d still like the blue line and bold font on the active tab and no grey border anywhere.

    Login details below.

    Thanks!
    Julie

    September 2, 2021 at 12:18 pm #1319485
    Rikard

    Hi,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
.responsive #top .main_color .tabcontainer .active_tab {
    background-color: transparent;
    color: #333;
    border-bottom: 5px solid blue;
}

.responsive #top .main_color .av_tab_section, .responsive #top .main_color .tabcontainer {
    border-color: transparent;
}
}

    Best regards,
    Rikard

    September 2, 2021 at 9:46 pm #1319550
    julhobart

    Thank you! This is very close! There is still a thin grey border above and below each tab title. Is there a way to remove that?

    September 4, 2021 at 6:26 am #1319711
    Rikard

    Hi,

    Please try this CSS instead:

    @media only screen and (max-width: 767px) {
.responsive #top .main_color .tabcontainer .active_tab {
    background-color: transparent;
    color: #333;
    border-bottom: 5px solid blue;
}

.responsive #top .main_color .av_tab_section, .responsive #top .main_color .tabcontainer {
    border-color: transparent;
}

.js_active .tab {
    border-width: 0;
}
}

    Best regards,
    Rikard

    September 7, 2021 at 7:58 pm #1320020
    julhobart

    Thank you, this worked!

    September 9, 2021 at 5:16 am #1320185
    Rikard

    Hi,

    Great, I’m glad that you got it working, and thanks for the update. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    September 9, 2021 at 4:49 pm #1320284
    julhobart

    Thanks, you can close

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Formatting Tabs and gallery’ is closed to new replies.