CSS Code to hide Breadcrumbs on Mobile Devices

This topic has 2 replies, 2 voices, and was last updated 1 year, 10 months ago ago by Olga Barlow

  • Avatar: Zubair Ahmed
    Zubair Ahmed
    Participant
    May 30, 2022 at 08:46

    Hi, I have tried many possible solutions to hide the breadcrumbs on mobile devices, also used your below code found in your forums support

    @media only screen
    and (max-width: 480px) {
    .breadcrumbs { display: none !important; }
    }

    ABOVE CODE IS NOT WORKING.

    Please help me how to hide the breadcrumbs on mobile devices.

    Thanks

    1 Answer
    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    May 30, 2022 at 15:47

    Hello,

    Try the below code

    @media only screen and (max-width: 480px) {
    .page-heading, .page-heading .breadcrumbs, .page-heading .woocommerce-breadcrumb {
            display: none !important; }
    }

    Regards

  • Viewing 2 results - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.