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

Fixed Navigation counters not styled in mobile dropdown

Arty

Well-known member
#1
When navigation tab has counter and is hidden in mobile dropdown menu (one with 3 lines), counter is shown in dropdown but isn't styled.

Example: tab "Test Tab 5" with counter "5" on desktop:

tab_with_counter.png

Same tab in dropdown on mobile device:

mobile_tab.png

Possible solution: add this to xenforo.css at the end of .blockLinksList rules:
Code:
    .blockLinksList a strong.itemCount
     {
       display: inline-block;
       float: right;
       font-size: 9px;
       line-height: 16px;
       color: @alertBalloon.color;
       background-color: #e03030;
       padding: 0 2px;
       border-radius: 4px;
       min-width: 12px;
       _width: 12px;
       text-align: center;
       text-shadow: none;
       white-space: nowrap;
       word-wrap: normal;
     }
 

CyberAP

Well-known member
#2
It's better not to use selector by element type. Just leave classes:

.blockLinksList .itemCount

And we also don't need display: inline-block;, element is already floated.

Nice spot, BTW.