html - css for different screen resolutions? -

if check html on 2 different systems different resolutions view distorted.

is there way of calculating screen width , height @ run time ?

i lack experience css did research , found :

https://css-tricks.com/css-media-queries/

but there suggesting different classes .(if not wrong)

my question possible height , width @ run time , use 1 css ?

something :

.view { min-width :"some how gets computed:which device using ?" min-height :"some how gets computed:which device using ?" } 

media queries choice problem.

you don't have use different classes these, have define different behaviour based on resolution.

you can know screen height , width javascript, css, dont think possible. best can css define range of devices in mobiles, tablets, laptops, large screen devices , based on media queries can define class on type of device.

have below example:

/* mobile */ @media screen , (max-width: 540px) {     .view {         width: 400px;     } }  /* tablets */ @media screen , (min-width: 540px) , (max-width: 780px) {     .view {         width: 600px;     } } 

actual dimensions can vary per case.

this same method many framework uses implement responsiveness.