mediaQueryMatch

mediaQueryMatch


Media query match

Ever wanted to see what media queries match your device?
Or wanted to compare the behavior of 's

This is an app that provides information about the width and height media queries that match your device with either the
set, or with the
set in one of the three default zoom modes Android device provide through the settings.

This is a helpful tool for front-end developers, enthusiasts or anyone that's making websites for mobile Android devices or PhoneGap/Cordova apps or any other app that uses a WebView.

This app makes no use of JavaScript or other techniques besides CSS to calculate the dimensions of the view, it only uses CSS @media queries.
That way you will be absolutely sure that the CSS media query matches a device with specific settings.

Media query match doesn't show device-width and device-height media queries because they will be exactly the same as the width and height media queries on Android browsers and in Android WebViews.

It does show you:
width and height media query values
if orientation is supported and its values
device-dpi values
This way it gives you a good idea of what settings are best for your mobile site or Android app (with WebView).

It provides you with the option to hide the title bar through an option in the menu (or by touching the screen for a couple of seconds on devices that support it) and it lets you easily switch between the width=device with media query page or the target-densitydpi=device-dpi page and gives you the option to reset the zoom for that page.
Or you can select a zoom level like the default zoom level options in the browsers settings.

Recent changes:
The app now shows 2 pages, "device-width" and "device-dpi" to be able to compare the two in certain zooming levels.
Also both pages are zoomable now and user zoom can be toggled.
Added more widths and height to always show the values and added some more device densities.
The three zooming levels are the ones that can be chosen from the browsers default zoom settings menu.
Removed the no-scale since it is bad practice.
Add to list
Free
100
5.0
User ratings
8
Installs
100+
Concerns
0
File size
30 kb
Screenshots
Screenshot of mediaQueryMatch Screenshot of mediaQueryMatch Screenshot of mediaQueryMatch Screenshot of mediaQueryMatch Screenshot of mediaQueryMatch Screenshot of mediaQueryMatch

About mediaQueryMatch
Media query match

Ever wanted to see what media queries match your device?
Or wanted to compare the behavior of 's

This is an app that provides information about the width and height media queries that match your device with either the
set, or with the
set in one of the three default zoom modes Android device provide through the settings.

This is a helpful tool for front-end developers, enthusiasts or anyone that's making websites for mobile Android devices or PhoneGap/Cordova apps or any other app that uses a WebView.

This app makes no use of JavaScript or other techniques besides CSS to calculate the dimensions of the view, it only uses CSS @media queries.
That way you will be absolutely sure that the CSS media query matches a device with specific settings.

Media query match doesn't show device-width and device-height media queries because they will be exactly the same as the width and height media queries on Android browsers and in Android WebViews.

It does show you:
width and height media query values
if orientation is supported and its values
device-dpi values
This way it gives you a good idea of what settings are best for your mobile site or Android app (with WebView).

It provides you with the option to hide the title bar through an option in the menu (or by touching the screen for a couple of seconds on devices that support it) and it lets you easily switch between the width=device with media query page or the target-densitydpi=device-dpi page and gives you the option to reset the zoom for that page.
Or you can select a zoom level like the default zoom level options in the browsers settings.

Recent changes:
The app now shows 2 pages, "device-width" and "device-dpi" to be able to compare the two in certain zooming levels.
Also both pages are zoomable now and user zoom can be toggled.
Added more widths and height to always show the values and added some more device densities.
The three zooming levels are the ones that can be chosen from the browsers default zoom settings menu.
Removed the no-scale since it is bad practice.

User reviews of mediaQueryMatch
Write the first review for this app!
Android Market Comments
A Google User
Mar 2, 2014
Nice Awesome
A Google User
Dec 18, 2013
A life saver If you use phonegap or webviews this congress in super handy.