-5

I'm building a one page responsive site and would like to know how to add a quick call button when the user view the site on their mobile phones but at the same time hide it when viewed on desktop or tablets.

Much appreciated in advance.

Bobby
  • 11
  • 4

2 Answers2

0

You can use CSS media queries to that effect by picking a specific window size at which the button disappears:

@media (min-width: 961px) {
  .button-call {
    display: none;
  }
}

You can target the physical screen resolution by using min-device-width instead of min-width.

For the button itself, see How to trigger a phone call when clicking a link in a web page on mobile phone

Community
  • 1
  • 1
le_m
  • 19,302
  • 9
  • 64
  • 74
0

@media only screen and (min-width:600px) {

        .hide-on-desktop, * [aria-labelledby='hide-on-desktop'] {

            display: none;

            max-height: 0;

            overflow: hidden;
        }

just make sure that your button has .hide-on-desktop class...