CODEWITHSUNDEEP
htmlipadmobilehide
Nyles
Nyles

Reputation: 15

Hide HTML elements from specific devices

I want to hide some HTML elements on a page for specific devices, so I can optimize the page structure when I look at it on iPad rather than PC..

To hide some DIVs on iPad, I gave the element a specific class ("x1") then used this CSS:

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {

    div.x1 { 
        visibility: hidden;
    }
}

And it worked, however I can't emulate the same on a PC version.. how can I hide things from PC only views?

Upvotes: 1

Views: 528

Answers (2)

ji-ruh
ji-ruh

Reputation: 701

Another way to solved this process it on the backend side. IF you are using php there is function $_SERVER['HTTP_USER_AGENT']; so you can know what kind of device is accessing your page.PHP get browser

Upvotes: 0

Arun Kumar M
Arun Kumar M

Reputation: 1601

Use below media query for only desktop 

@media only screen and (min-device-width : 1024px) {
    div.x1 { 
        visibility: hidden;
    }
}

Upvotes: 2

Related Questions