Navigation
Archive / x-hide-xs custom element
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • October 23, 2016 at 11:36 pm #1227874
    Braden
    Participant

    Hi I am using the following code to add some text into the header and I am not wanting it to display on mobile. I see reference to visibilty but I am having trouble implementing it. Could anyone please assist? x-hide-xs x-hide-sm

    MY css

    /*Add Text to To Header*/
.custom-ph {
position: relative;
top: 85px;
float: right;
font-size: 28px;
right: -46px;
}
.masthead-inline .desktop .x-nav {
margin-top: -39px;
}

    So I am just wanting this code not to run on small screens and phones. Thanks for any help!

    October 24, 2016 at 12:17 am #1227905
    Rupok
    Member

    Hi there,

    As you are using custom CSS, you can hide this with CSS as well. Let’s add this under Custom > CSS in the Customizer.

    @media only screen and (max-width: 767px) {
.custom-ph {
    display: none;;
}
}

    Hope this helps.

    October 24, 2016 at 12:22 pm #1228616
    Braden
    Participant

    Man, that is great! Worked perfectly! Thanks for your help. Hide CSS with CSS 🙂

    October 24, 2016 at 12:41 pm #1228648
    Prasant Rai
    Moderator

    You are most welcome. 🙂

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1227874 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>