Opened 10 years ago

Closed 10 years ago

Last modified 10 years ago

#628 closed defect (bug) (fixed)

Media query for banner image is currently webkit only

Reported by: scottsweb's profile scottsweb Owned by:
Milestone: Priority: normal
Component: Plugin Directory Keywords:


When viewing a plugin which has uploaded a retina version of the banner image you can only see the retina image when using a webkit browser.

Here is an example from:

#plugin-title {
	background-image: url(//;
	background-size:772px 250px;
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
	#plugin-title {
		background-image: url(//;

The media query should cover more browsers, for example:

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (-moz-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 144dpi),
only screen and (min-resolution: 2dppx) {
	#plugin-title {
		background-image: url(//;

Change History (3)

#1 @Otto42
10 years ago

That seems a bit excessive. Wouldn't just adding the min-resolution ones work nowadays?

#2 @Otto42
10 years ago

  • Resolution set to fixed
  • Status changed from new to closed

I added the rules for Opera and the min-resolutions. That should cover everything current that I can find.

#3 @scottsweb
10 years ago

Excellent. Thanks :)

Note: See TracTickets for help on using tickets.