Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

dpi in android ?

Featured Replies

I can't find any specific information that tells me whether or not Android understand the media query (min-resolution:dpi) ?

 

As well, I was informed that for all of Android hdpi, including retina 3, one must use to keep sane, across the board x2 images ?

If you're using responsive images http://alistapart.com/article/responsive-images-in-practice along with the

picturefill polyfill:

http://github.com/scottjehl/picturefill

 

Then you can let the browser decide which image to serve up to the device. This a lot smarter than user agent / device sniffing to decide what image to serve. The browser is in a better place to make that decision.

Edited by rbrtsmith

if it's just a background image i'd probably just serve up the 1x version as a background is supposed to be just for decorative purposes. If it's a pattern then look into SVG for ultra sharpness.

 

Of course there's occasions when you may want to serve a 2x background. you *can* use media querys for media resolution. The browser support can be seen here http://caniuse.com/#feat=css-media-resolution

  • Author

if it's just a background image i'd probably just serve up the 1x version as a background is supposed to be just for decorative purposes. If it's a pattern then look into SVG for ultra sharpness.

 

Of course there's occasions when you may want to serve a 2x background. you *can* use media querys for media resolution. The browser support can be seen here http://caniuse.com/#feat=css-media-resolution

 

The image to which I want to use is not for decorative purpose, as I mentioned; to cover all of Android hdpi, I was informed to create a 2x image which will cover all of Android hdpi, anyone have such experience ?

 

Do you have complete control over colorizing SVG images with CSS, or must you let a vector based program do most of the lifting before bringing it into the code ?

 

Android does not appear to support the MQ (min-resolution:dpi) as I was unable to find anything related to support it ?

According to the Caniuse link I posted above Android does support resolution based MQ.

 

Regarding the SVG if it is in a background image it cannot by styled via CSS.

  • Author

I was using the wrong search with CanIUse; good to know.

 

rbr - I assume have never used 2x images when it comes to background images to cover all of hdpi Android resolutions with MQ ?

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.