1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.2 Selecting Tabs for CSS in Responsive mode

Discussion in 'Styling and Customization Questions' started by smartpixels, Aug 25, 2013.

  1. smartpixels

    smartpixels Active Member

    Specific classes link forums, members and others are removed during responsive mode and only class available is navlinks so what is the solution designers are using?
     
  2. Jeremy

    Jeremy XenForo Moderator Staff Member

    What classes are you seeing removed? .navTabs.tab still exists.
     
  3. smartpixels

    smartpixels Active Member

    Normal members tab
    HTML:
    <li class="navTab members Popup PopupControl PopupClosed PopupContainerControl">
               
                    <a class="navLink" href="http://localhost/Xenforo/members/">Members</a>
                    <a rel="Menu" class="SplitCtrl" href="http://localhost/Xenforo/members/"></a>
                   
                   
                </li>
    Responsive mode
    HTML:
    <li><a class="navLink" href="http://localhost/Xenforo/members/">Members</a></li>
    Anyway I decided to nth child property in CSS to target it but that will be an issue if I add tabs later on.
     
  4. Jeremy

    Jeremy XenForo Moderator Staff Member

    Are you using the default style? I'm looking at the HTML for this page (in narrow responsive with) and I'm seeing this for the resources tab:

    HTML:
    <li class="navTab members Popup PopupControl PopupClosed PopupContainerControl" style="display: none;">
                    <a href="http://xenforo.com/community/members/" class="navLink">Members</a>
                    <a href="http://xenforo.com/community/members/" class="SplitCtrl" rel="Menu"></a>
                </li>
    So .navTab.members still exists in responsive for me.
     
  5. smartpixels

    smartpixels Active Member

     

    Attached Files:

  6. Jeremy

    Jeremy XenForo Moderator Staff Member

    You'll need to modify templates, but I'm not sure if that specific portion of the template is built in templates or JS.
     
  7. smartpixels

    smartpixels Active Member

    Thank you for the help Even on a Sunday
    I will try to figure something out or go dirty with Jquery
     
  8. Jeremy

    Jeremy XenForo Moderator Staff Member

    If you modify the navigation template, and find all instances of...
    Code:
    class="navLink"
    And add in the necessary extra classes it will (or should if I read the JavaScript correctly) carry over to the responsive menu like you were expecting.
     

Share This Page