Jump to content


 


Register a free account to unlock additional features at BleepingComputer.com
Welcome to BleepingComputer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.


Click here to Register a free account now! or read our Welcome Guide to learn how to use this site.

MacBook Pro With Retina Display


  • Please log in to reply
3 replies to this topic

#1 Guest_slehmann36_*

Guest_slehmann36_*

  • Guests
  • OFFLINE
  •  

Posted 09 August 2013 - 06:43 AM

Hi, 

 

I am using this html to call a specific .css file according to screen size:

 

 

      <!-- Include Stylesheet for standard computer screens -->        
      <link rel="stylesheet" type="text/css" media="only screen and (min-device-width: 1537px)" href="stylesheet.css" />
 
        <!-- Include Stylesheet for iPad screens -->
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 481px) and (max-width: 1536px)" href="ipad_stylesheet.css" >
 
       <!-- Include Stylesheet for mobile devices -->
      <link rel="stylesheet" type="text/css" media="only screen and (min-width: 0px) and (max-width: 480px)" href="mobile_stylesheet.css" >
 
the problem is that when viewing the website on a macbook pro with retina display, it uses the iPad stylesheet.
we all know that the macbook has a screen width of 1600px. is it possible that safari still uses the old resolution of the non-retina macbooks when it comes to the media="" attributes?
 
Thanks
 
Simon Lehmann

 



BC AdBot (Login to Remove)

 


#2 groovicus

groovicus

  • Security Colleague
  • 9,963 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:Centerville, SD

Posted 09 August 2013 - 07:04 AM

Based on the other dozen or so examples I looked uo on Google, I am not sure if your syntax is correct, becuase 'only' does not appear to be part of the syntax. I have yet to find a single example I also think your assumption about Retina resolution is incorrect. 1600 is not a standard width, 1680 is, and the Retina tablets far surpass that ability. Screen resolution also depends on the size of the device.

 

Where did you find that code?
 


Edited by groovicus, 09 August 2013 - 07:04 AM.


#3 Guest_slehmann36_*

Guest_slehmann36_*

  • Guests
  • OFFLINE
  •  

Posted 09 August 2013 - 07:27 AM

I found the code at

 

http://www.yourinspirationweb.com/en/tips-tricks-how-to-optimize-a-website-for-mobile-devices/

 

Just before the "Not only CSS" heading



#4 groovicus

groovicus

  • Security Colleague
  • 9,963 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:Centerville, SD
  • Local time:10:33 PM

Posted 09 August 2013 - 12:42 PM

Right before that, it says "When html5 will be totally implemented, we could manage the style sheets this way:"...... HTML5 has been fully implemented, across all browsers, you need to use the user agent string to identify the type of platform, as shown in the example directly before.

 

At least that is how I read it.






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users