Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • christofferl Friend
    #954345

    I am trying to experiment on the position "top-right" on this template and would like to show a FA icon only when viewing the site with smaller screen.

    I have understood that one can use

    <em class="fa fa-phone hidden-lg hidden-md hidden-xs"></em>

    Please explain all these possible features and how to use them.

    Pankaj Sharma Moderator
    #954370

    Hi
    Hidden-xs is used for extra small
    you should remove it from the code so it can be shown .
    More info On responsive classes Here

    christofferl Friend
    #954403

    Thanks, now it is all working as I want it except from the small vertical grey line that still is present when hiding in smaller screens.

    I use the following code for 3 links in the uppder right-top position

    <ul>
    <li><em class=""></em><span class="hidden-xs gray-light"><a href="index.php?option=com_k2&view=item&layout=item&id=47&Itemid=460"> Föreslå ny kategori</a></span></li>
    
    <li><em class=""></em><span class="hidden-xs gray-light"><a href="index.php?option=com_k2&view=item&layout=item&id=46&Itemid=459"> Rekommendera ny Webbutik</a></span></li>
    
    <li><em class="fa fa-envelope-o"></em><a href="index.php?option=com_k2&view=item&layout=item&id=42&Itemid=276"> Kontakta oss</a></li>
    </ul>

    Any suggestions on how to remove the grey line when hiding ?


    1. ja_line2
    2. ja_line1
    Pankaj Sharma Moderator
    #954413

    Hi,
    post your working site URL here

    christofferl Friend
    #954419

    I just added admin login info. The menu appears on every page on my site at the right top corner. Decrease the browser window and you will see what happens.

    Hope to hear from you soon again.

    Pankaj Sharma Moderator
    #954537

    Hi
    i am getting a different view in mobile >> http://prntscr.com/by7p85
    Please check , there is no line as in your screenshot .

    christofferl Friend
    #954603

    Your image that you sent is just as it should be. If you look carefully in the images I sent you the ja_line1.png shows the light grey vertical line appearing. I would like to get rid of it when shrinking the screen resolution togheter with the text that disappears. If you expand the browser all text including the grey vertical lines appear as seperator – just as it should.

    Please let me know if you understand what I mean. If not I will clarify it in more details.

    Pankaj Sharma Moderator
    #954615

    Hi
    Add below code in custom.css file

    
    @media (max-width: 7680px) {
    .t3-top-bar .top-right ul li + li {
        border-left: none;
    } }

    save and check .

Viewing 8 posts - 1 through 8 (of 8 total)

This topic contains 7 replies, has 2 voices, and was last updated by  Pankaj Sharma 7 years, 8 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum