XS and SM visibility for iPhone 6

[djigoboom]

Hi,

I noticed that content that appears on the iPhone 4 and 5 does not show up at all on the iPhone 6. Is there a css hack that would resolve this or do I need to edit any of the css files that came with the theme?

If so, which line of code or media query do I need to use?

I can reply with screen shots via private message.

[Kyle – SUPPORT]

Hi

Not sure if Bootstrap have looked into this yet, but there’s a good chance the iPhone screen size is above the breakpoint for phones, and fits in to the tablet screen size. Using visible-sm as well as visible-xs should do it

– Kyle

[djigoboom]

Hi Kyle,

Thanks for your reply. I am using those shortcodes, and they do not work for the iPhone 6. I thought they would work, but where content shows up for the iPhone 4 and 5, nothing but white space shows up on the iPhone 6 in portrait (visible-xs), or in landscape (visible-sm).

I believe this can be fixed with a css hack.

(css) device-width of iPhone 6 is 375px, of iPhone 6 Plus is 414px. Note that iPhone 6 report report window.devicePixelRatio = 2 while the 6 Plus report window.devicePixelRatio = 3 (while not truly at 3 DPR)

See this link for a reference:

http://mydevice.io/devices/

What do you suggest?

[Kyle – SUPPORT]

Please can you provide me with your link so I can check it out?

– Kyle

[Kyle – SUPPORT]

If you look here: http://getbootstrap.com/css/#responsive-utilities

The lowest breakpoint is < 768px therefore your content should still be visible on iPhone 6. - Kyle