Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • January 16, 2018 at 9:35 pm #898163
    34oldcat29

    Hi everyone, I am trying to show some sections and hide some sections from on mobile vs desktop.

    I tried the following CSS, and applied the appropriate tags (“only-mobile and only-desktop) to each section.

    @media only screen and (min-width: 769px) {
    .only-mobile { display: none !important; }}
    @media only screen and (max-width: 768px) {
    .only-desktop { display: none !important; }}

    The end result is both items show on desktop, mobile and tablet. Any ideas?

    January 17, 2018 at 5:37 am #898288
    Mike

    Hey 34oldcat29,
    Your tags are ID’s not classes, please try this instead:

    @media only screen and (min-width: 769px) {
#only-mobile { display: none !important; }}
@media only screen and (max-width: 768px) {
#only-desktop { display: none !important; }}

    Please clear any cache plugin and your browser cache.

    Best regards,
    Mike

    January 17, 2018 at 7:00 pm #898632
    34oldcat29

    Thanks Mike. I changed tags to IDs and cleared cache on three separate systems but still show both mobile and desktop sections on all devices. Do you see the same on your end?
    Anything else I may be missing?
    To be clear, I created a page title only for desktops with the “only-desktop” tag. I created a second page title with the “only-mobile” tag.

    January 17, 2018 at 9:47 pm #898690
    Mike

    Hi,
    Yes I’m seeing the same, yet when I add the css to my browser only one or the other will show. Can you please include a admin login in the private content area so we can take a closer look.

    Best regards,
    Mike

    January 17, 2018 at 9:54 pm #898692
    34oldcat29
    This reply has been marked as private.
    January 17, 2018 at 10:15 pm #898702
    34oldcat29
    This reply has been marked as private.
    January 17, 2018 at 10:31 pm #898709
    Mike

    Hi,
    You had a few errors in your quick css, I corrected and now your site is working. please clear your browser cache and check.

    Best regards,
    Mike

    January 17, 2018 at 10:55 pm #898727
    34oldcat29

    Ha! I see the error now!

    } in the wrong place

    Thank you sir

    January 17, 2018 at 11:05 pm #898739
    Jordan Shannon

    Hi,

    Did you need further help, or shall we close this thread?

    Best regards,
    Jordan Shannon

    January 17, 2018 at 11:16 pm #898747
    34oldcat29

    Case closed! All working now!

    January 17, 2018 at 11:21 pm #898752
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘hiding/showing sections on mobile vs desktop’ is closed to new replies.