Questions tagged [retina]

Name used by Apple for their liquid crystal displays with a high pixel density.

239 questions
2
votes
1 answer

What's the trick to getting HTML5 background video to fill the height on retina displays?

I built a new client splash-page using background video, and aside from responsive tweaks for iPhone and killing background video on iOS, it didn't occur to me to test on retina. Today, as I view on the MBP Retina, it looks like the video is…
Alan
  • 29
  • 2
  • 7
2
votes
1 answer

CSS border getting clipped on retina display

Depending on the width of the browser window the border of some elements like this deposit button get clipped. When I resize the width of the browser, if I move it pixel by pixel the border is clipped and then unclipped with each pixel move, so…
Adam Langsner
  • 1,276
  • 1
  • 15
  • 23
2
votes
2 answers

Issues with overflow:hidden in Chrome on a 'retina' display

I have a CSS problem that only occurs in Google Chrome. Objects set to overflow: hidden are being 'clipped' at the edges when within a horizontally centred container, and only at odd browser widths, and only on a high-res…
Ade
  • 2,961
  • 4
  • 30
  • 47
2
votes
1 answer

Adding many SVG or Icon Fonts to a page - Performance

I was going to use SVG for all the many icons I use on my site but have read that using tons of SVG will slow down a site. I basically have tons of search results on my website and each result has like 7 icons on them. Another developer helping me…
mike
  • 749
  • 2
  • 13
  • 24
2
votes
0 answers

Media queries for Ipad mini with retina display?

for Ipad mini(non-retina): @media screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) for Ipad 3&4(retina): @media screen and (device-width: 768px) and (device-height: 1024px) and…
Vincent Chua
  • 969
  • 6
  • 20
  • 41
2
votes
1 answer

Can you retinafy images while using background-size:cover, instead of specifying dimensions?

so I've read a few stuff about retina graphics for website and since most of my images can be at 2X, I'd guess: Why not, while using @media queries. However, all I could find about sizing, was that you should specify dimensions, but I'm wondering:…
Sander Schaeffer
  • 2,757
  • 7
  • 28
  • 58
2
votes
0 answers

Get retina scaled icons from iTunes search API

I'm pulling live icons in iTunes Appstore from the iTunes api: http://www.apple.com/itunes/affiliates/resources/documentation/itunes-store-web-service-search-api.html#searchexamples Like…
Jonny
  • 15,955
  • 18
  • 111
  • 232
2
votes
4 answers

Optimizing website images for Retina display

I've been trying to find a good approach to solve a very commmon problem in the retina era. Lets say the following is given: Create a website with responsive images No CSS background images Websites basic functionality must be working without…
Michael Falck Wedelgård
  • 2,943
  • 1
  • 27
  • 39
2
votes
1 answer

IOMobileFramebufferGetLayerDefaultSurface does not work on ios7 retina

I want to capture a screenshot from a background service. It work fine under ios6 and ios7,but crash under ios7 retina. this is my code { IOMobileFramebufferConnection connect; kern_return_t result; m_screenSurfaceRef = NULL; …
joeykika
  • 21
  • 3
2
votes
1 answer

Website too large for Retina display

My website looks very big on Retina display. All fonts and div elements are bigger than what I see in Chrome. Any idea how I can fix this?
John Macl
  • 331
  • 2
  • 5
  • 12
2
votes
2 answers

How to link Retina favicon for Safari Reading List?

I have created my favicon in various sizes. It looks great in the address bar on my Retina MacBook Pro, but the favicon in the Safari Reading List is pixelated. I was under the impression it uses a 32px version, but on a Retina display that would be…
Jordan H
  • 52,571
  • 37
  • 201
  • 351
2
votes
1 answer

Half pixel border radius in retina

When using a retina display, is it possible to use half-pixel border radius like this: #box { height: 3px; width: 100px; border-radius: 1.5px; } I did it on my retina iPhone 4, and it shows up as a 1px border radius. Any reasons and/or…
ambrosechua
  • 139
  • 1
  • 7
2
votes
2 answers

need to fix retina sprite css issue

I'm trying to optimize the mobile skin for www.talkjesus.com to be retina clear. I accomplished this with standalone images such as the facebook/twitter icons, the logo and the top right 3 icons in the header as well. Problem I'm having is doing…
user548066
2
votes
1 answer

Change LESS variable if media query conditional is met

I wish to change some LESS variables (for maintaining high-res image pathways) if certain media query conditionals are met throughout my stylesheet, but I can't seem to get it to work. // Default @logo: 'logo.png'; @sprite: …
Staffan Estberg
  • 6,795
  • 16
  • 71
  • 107
2
votes
1 answer

How to create retina image from JPEG with PHP

A few months ago i wrote the following script to convert an uploaded image with PHP to Retina and non retina images. The iphone app that was working with this script only used PNG images, so i wrote the script to work with PNG's. $filename =…
RTB
  • 5,773
  • 7
  • 33
  • 50