Browsing device properties via HttpBrowserCapabiltiesBase are way off.

Question

User1621932393 posted

Wondering if I am doing something wrong or if there is another solution altogether.

Here is some testing code I just wrote out:

HttpBrowserCapabilitiesBase browser = this.Context.Request.Browser;
    var width = browser.ScreenPixelsWidth;
    var height = browser.ScreenPixelsHeight;
    var maxheight = browser.MaximumRenderedPageSize;
    bool mobile = browser.IsMobileDevice;

    string pageUrl = Request.Url.AbsolutePath.ToString();
    
    if(width < 960)
    {
        ...
    }

I am testing on my development machine which of course is a desktop. My screen resolution is 1920 x 1200. However, my width and height variables are getting set to 640 and 480 respectively. I have tested this in IE and Chrome so far.

Answer 1

User1779161005 posted

Some of these values aren't determined dynamically (like width/height). These values were originally developed when there was a handful of devices and they could build a server-side database with all the known dimensions of these devices. If you need to know the dimensions at runtime use JavaScript in the browser.

Answer 2

User1943143334 posted

Hi,

HttpBrowserCapabilities class won't provide you accurate browser details!!!

You may need to build your own - http://roopeshreddy.wordpress.com/2012/06/24/detect-requesting-device-type-and-redirect-in-asp-net/

Otherwise, you may have to use CSS3 Media queries - http://www.css3.info/preview/media-queries/

http://www.w3.org/TR/css3-mediaqueries/

http://mobile.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/

Hope it helps u...