Tagged: , ,

Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • October 11, 2015 at 8:50 pm #517024
    Munford

    Hi Guys

    I am trying to style my tabs for mobile, found the code to have it not break into accordian via a support thread ( https://kriesi.at/support/topic/tabs-mobile-appearance-help/) and it’s looking good except I need my top border on the tabcontainer showing. I have this in the code

    .responsive .tabcontainer .tab, .responsive #top .alternate_color .tabcontainer, .responsive #top .alternate_color .active_tab_content {
    border: none !important;
    }
    can you help me get it to work? thanks
    Nancy

    • This topic was modified 8 years, 8 months ago by Munford.
    October 11, 2015 at 10:20 pm #517049
    Basilis

    Hi Munford!

    The code you show us is actually removing the border not making it for us to see it.
    Do you want to show it or hide the border?

    Cheers!
    Basilis

    October 11, 2015 at 11:12 pm #517077
    Munford

    I want to hide all but the top border on the tab area on mobiles

    October 13, 2015 at 4:55 am #517827
    Rikard

    Hi Nancy,

    I couldn’t see any top borders on mobile view, did you manage to get it fixed? If not then please post a screenshot highlighting what you would like to remove.

    Best regards,
    Rikard

    October 13, 2015 at 5:19 am #517829
    Munford

    I want only the top border to show – there are none now

    October 13, 2015 at 12:01 pm #517999
    Yigit

    Hi!

    Please add following code to Quick CSS 

    @media only screen and (max-width: 768px) {
.active_tab_conten { border-top: 1px solid #e2e2e2!important; }}

    Cheers!
    Yigit

    October 13, 2015 at 1:45 pm #518074
    Munford

    Hey Yigit,
    I added this:
    @media only screen and (max-width: 768px) {
    .active_tab_content { border-top: 1px solid #e2e2e2!important; }}

    but it did not work. :(
    I have other media inquiries that are (max-width: 767) – does the size there make a difference?
    thanks for taking a look
    Nancy

    October 14, 2015 at 12:19 pm #518604
    Andy

    Hi!

    code should work. Try to clear browser cache and hard refresh a few times.

    Yes it does make a difference as it defines the maximum screen size for the following code.

    Best regards,
    Andy

    October 14, 2015 at 12:46 pm #518612
    Munford

    Hi Andy

    I have cleared the cache and same thing – still no top border
    see: http://imgur.com/sriI6BI ??

    I meant does it matter if the size is 768 or 767 as I have code with both sizes – which is better for ipad size?
    thanks for your help
    Nancy

    October 14, 2015 at 1:06 pm #518619
    Yigit

    Hi!

    Please change the code to following one 

    @media only screen and (max-width: 480px) {
.tab_titles {
    border-top: 1px solid #e2e2e2;
}}

    Cheers!
    Yigit

    October 14, 2015 at 1:20 pm #518628
    Munford

    Great! that got me the top border – see http://imgur.com/Rx6qaRW
    now I just need to make the bottom border on the active tab visible again…
    and is it possible to put a border between the 2 rows?
    thanks so much
    Nancy

    • This reply was modified 8 years, 8 months ago by Munford.
    October 15, 2015 at 2:22 pm #519318
    Andy

    Hey!

    about which bottom border are you talking about? and between which 2 rows do you wish to have a border? Can you show us what you want to achieve please?

    Best regards,
    Andy

    October 15, 2015 at 2:38 pm #519331
    Munford

    Hey Andy
    I would like the border to show below the active tab title HOTEL (see here http://imgur.com/Rx6qaRW)
    and if possible a border under the tab titles: OVERVIEW / ITINERARY / PRICING, that is between the two rows of tab titles.
    thanks
    Nancy

    October 15, 2015 at 2:51 pm #519344
    Andy

    Hi!

    try this code:

    .responsive #top .main_color .tabcontainer .active_tab {
border-bottom: red 1px solid !important;
}

    Best regards,
    Andy

    October 15, 2015 at 7:30 pm #519508
    Munford

    thanks I will work on it.

    October 16, 2015 at 9:19 am #519721
    Rikard

    Hi,

    Great, let us know how you get on with it.

    Thanks,
    Rikard

    November 3, 2015 at 3:41 pm #529341
    Munford

    thanks I figured it out.

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘tab styling mobile – top border’ is closed to new replies.