CODEWITHSUNDEEP
csszurb-foundation
Hedge
Hedge

Reputation: 16748

Target mobile devices with big screen dimensions using Foundation

I'm using the visibility-classes of Foundation (http://foundation.zurb.com/docs/components/visibility.html) in order to display my website differently on mobile devices.

However the more recent smartphones have insane scree-dimensions (e.g. Nexus 6 2560 × 1440 Pixel).

I don't have such a device and therefore can't test whether classes like hide-for-small-onlystill work there. Afaik small means less than 640 pixels.

So how can I deliver the same page across all smartphones? Even though these devices have huge screen-dimensions I'd still like to display a simplified homepage.

Upvotes: 0

Views: 85

Answers (1)

Tomer Almog
Tomer Almog

Reputation: 3868

Foundation visibility classes are based on media queries that checks only screen width.

If you want to target mobile devices you can detect mobile device (not the best practice but useful many times). here is a good way to do it: http://detectmobilebrowsers.com/

once you detect the mobile user (on the back-end or front-end) you can add a class to your body and target that separately on your css.

Unfortunately, I don't think there an easy workaround this.

Upvotes: 1

Related Questions