4 replies to this topic

[ACTIONpack]

I'm trying to get Retina favicon work on high resolution screen like Retina macbook pro and getting the ico showing up on a standard screen. If I put the favicon.ico in there then the high rez will not show up on my Retina macbook pro but if I take out the ico then it does not show up on standard screen.

<link rel="shortcut icon" href="images/favicon.ico" />
<link rel="icon" type="image/png" href="http://www.romabio.com/images/retina-logo.png" />

[ACTIONpack]

Got a work around for this. If you want to get a high resolution version on the ICO then add a height and width to the short ico meta tag. Example below!

<link rel="shortcut icon" href="url link" style="height: 128px; width: 128px;" />
<link rel="icon" type="image/png" href="url link" />
<link rel="apple-touch-icon-precomposed" href="url link" />

[primexx]

you could also try icons with multiple sizes but i'm not sure if the browsers actually pick the right size

[AWKM]

also

<link rel="apple-touch-icon" href="/whatever.png">

[The_Decryptor]

Unfortunately you'll have to use an ico file (With at least 16x16 and 32x32), I'm not sure any browser supports the standard method for it currently.

ACTIONpack, on 26 February 2013 - 20:29, said:

Got a work around for this. If you want to get a high resolution version on the ICO then add a height and width to the short ico meta tag. Example below!

<link rel="shortcut icon" href="url link" style="height: 128px; width: 128px;" />
<link rel="icon" type="image/png" href="url link" />
<link rel="apple-touch-icon-precomposed" href="url link" />

Does that actually work? In what browser?

If you want to specify a size you use the "sizes" attribute, CSS is meaningless for this.