CSS - height of a div across multiple devices

Question

So I have two devices, a 40" LCD and a 7" tablet, both devices are 1080p, so from a CSS standpoint, the devices are pretty much the same in terms of loading screen dependent CSS like:

@media(max-width:1080px){
   .myDiv { ... }
}

I have a div, the div contains sensitive data, on a tablet I want it to be large so that the user can read it, but on the LCD I want it to be small.

What is a good way to solve this problem? Is there a way to load stylesheets based on mobile user agents vs desktop user agents?

score 2 · Accepted Answer · answered May 09 '14 at 15:57

2

Assuming the 40" LCD is a TV, this may solve your problem:

@media tv {

    .sensitive {
         height: 40px;
    }

}

Other media types can be found here.

answered May 09 '14 at 15:57

ncksllvn

5,699
2
21
28

CSS - height of a div across multiple devices

1 Answers1