- Microlancer Beta Tester
- Sold between 100 000 and 250 000 dollars
- Most Wanted Bounty Winner
- Author was Featured
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Bought between 10 and 49 items
- Exclusive Author
- Has been a member for 2-3 years
Does anyone have a @media query that will only affect the iPhone 5 when in landscape position?
The few I have found on Google don’t seem to be working properly when tested on the device. When in landscape the device is extra wide this time around, I need a media query to work only in this state.
- Community Superstar
- Sold between 1 000 and 5 000 dollars
- Bought between 10 and 49 items
- Has been a member for 2-3 years
- United States
- Exclusive Author
tired using device width?
@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 1136px) {
}
- Envato Staff
- Reviewer
- Community Moderator
- Venezuela
- Has been a member for 4-5 years
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Microlancer Beta Tester
- Sold between 10 000 and 50 000 dollars
- Exclusive Author
There ya go http://halgatewood.com/iphone-5-media-query/
- Microlancer Beta Tester
- Sold between 100 000 and 250 000 dollars
- Most Wanted Bounty Winner
- Author was Featured
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Bought between 10 and 49 items
- Exclusive Author
- Has been a member for 2-3 years
Ivor said
There ya go http://halgatewood.com/iphone-5-media-query/
Thanks Ivor, will this play nice with the iPhone 4? I no longer have it for testing :/ kinda wish I kept it now lol
- Has been a member for 4-5 years
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Sold between 50 000 and 100 000 dollars
- Microlancer Beta Tester
- Community Moderator
- Interviewed on the Envato Notes blog
- Author was Featured
- Bought between 1 and 9 items
- Referred between 50 and 99 users
TylerQuinn said
Ivor saidThanks Ivor, will this play nice with the iPhone 4? I no longer have it for testing :/ kinda wish I kept it now lol
There ya go http://halgatewood.com/iphone-5-media-query/
Use media query portrait and landscape. Much better. Make elements liquid for resolutions smaller than 800 pixels and tadaa! You’ve solved the problem! 
- Has been a member for 4-5 years
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Sold between 50 000 and 100 000 dollars
- Microlancer Beta Tester
- Community Moderator
- Interviewed on the Envato Notes blog
- Author was Featured
- Bought between 1 and 9 items
- Referred between 50 and 99 users
TylerQuinn said
Ivor saidThanks Ivor, will this play nice with the iPhone 4? I no longer have it for testing :/ kinda wish I kept it now lol
There ya go http://halgatewood.com/iphone-5-media-query/
Use media query portrait and landscape. Much better. Make elements liquid for resolutions smaller than 800 pixels and tadaa! You’ve solved the problem!
- Microlancer Beta Tester
- Sold between 100 000 and 250 000 dollars
- Most Wanted Bounty Winner
- Author was Featured
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Bought between 10 and 49 items
- Exclusive Author
- Has been a member for 2-3 years
Enabled said
TylerQuinn saidUse media query portrait and landscape. Much better. Make elements liquid for resolutions smaller than 800 pixels and tadaa! You’ve solved the problem!
Ivor saidThanks Ivor, will this play nice with the iPhone 4? I no longer have it for testing :/ kinda wish I kept it now lol
There ya go http://halgatewood.com/iphone-5-media-query/
I was thinking about this, but most responsive frameworks use set widths (skeleton I am using being one of them) so this is a real pain. Looks like I will be spending the rest of my day messing with media queries
I’m just glad the theme is close to done so really its just about tailoring a special view for the IP5 ’s wide screen.
- Microlancer Beta Tester
- Sold between 100 000 and 250 000 dollars
- Most Wanted Bounty Winner
- Author was Featured
- Repeatedly Helped protect Envato Marketplaces against copyright violations
- Bought between 10 and 49 items
- Exclusive Author
- Has been a member for 2-3 years
When tested on the device I found none of these worked.
For anyone trying to work with the new iPhone 5 in landscape try using this media query:
@media only screen and (min-width: 560px) and (max-device-width: 1136px) {
/* iPhone 5 CSS */
}
