Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #525789

    Hi,
    On one of my pages, I need to re-position tab titles from the content elements to the bottom of the container. Currently, in the settings, there are options to position the tab tiles on top, left or right but not on the bottom of the container.
    Is it possible to do that with quick CSS code in General styling or applying the code in the custom CSS class? Since I am using tabs on other pages as well, the CSS code will have to pertain to that individual page.
    Thank you so much.
    Ria

    #525918

    Hi tswilson!

    May we have a link to your website so we can provide you with the appropriate css?

    Best regards,
    Dake

    #527097

    Hi Dake,
    Here is my login credentials.
    Thank you.
    Ria

    #527126

    Hey!

    I’m getting an error message when trying to log into your website.

    Do you have any security plugins enabled?

    Regards,
    Dake

    #527137

    Hi Dake,
    Would you please try again with the same login?
    Thank you.

    #527845

    Hey!

    Are you trying to place the tabs below the map? Try this in the Quick CSS field:

    #top .tab_titles {
        position: absolute;
        bottom: 0;
    }
    
    #top .tabcontainer {
        padding-bottom: 50px;
    }

    If you don’t want to affect other tab elements, turn on the custom css class field then add a unique class to the tab element. Refer to this link: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    Best regards,
    Ismael

    #528047

    Hi Ismael,

    The two CSS codes that you gave me work perfectly. Thank you so much.
    However, I am having trouble with inserting the unique class to the custom class tabs element.

    1. Since you gave me two css codes, do I need to create two unique classes in quick css for each code or only one for both codes?
    (Did I insert the unique name to the code correctly?)

    Unique name: ria-tabs

    #top .tab_titles ria-tabs {
    position: absolute;
    bottom: 0;
    }

    Unique name: ria-tabspadding

    #top .tabcontainer ria-tabspadding{
    padding-bottom: 50px;
    }

    2.Is it possible to insert two unique classes in the tabs custom class element? In this case the first will be for the tabs position and the other for the tabs padding. If yes, how do I write/separate the two unique classes properly? (with a coma or a semicolon… or?)

    Thank you for your help.
    Cheers,
    Ria

    #528643

    Hey!

    You added classes to your elements correctly but while adding custom CSS code, you missed dots. Your code should be as following

    #top .tab_titles .ria-tabs {
    position: absolute;
    bottom: 0;
    }
    #top .tabcontainer .ria-tabspadding{
    padding-bottom: 50px;
    }

    Yes, you can insert two custom classes as following “ria-tabspadding ria-tabsmargin”

    Cheers!
    Yigit

    #528796

    Hi Yigit,
    Thank you for your reply and for pointing my error.
    I corrected the codes, inserted the two custom classes as you suggested in the tabs css elements, cleared the cache but unfortunately it didn’t work.
    However, the two css codes that you gave me originally without adding the custom classes work perfectly. I am assuming the problem is in the two custom classes “ria-tabs ria-tabspadding” that I am inserting into to the tabs element. ”

    If you would like to see the webpage the login to the site is still active.
    Thank you.
    Cheers!
    Ria

    #529030

    Hey!

    You only need a single css class. Please remove the other then replace the code with this:

    #top .ria-tabs .tab_titles {
    position: absolute;
    bottom: 0;
    }
    
    #top .ria-tabs .tabcontainer {
    padding-bottom: 50px;
    }

    Regards,
    Ismael

    #529604

    Hi Ismael,

    It worked! Thanks a million. You guys are awesome!

    Cheers,
    Ria

    #529819

    Hi,

    Great, glad we could help :-)

    Best regards,
    Rikard

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