Menu icon Foundation
Prototyping: How do you target different orientations with the html class attributes?

This question only concerns prototyping; I know it can be done with SCSS mixins, but I'm trying to do something like this – why won't it seem to work?

<div class="medium-portrait-4 medium-landscape-7"></div>
<div class="medium-portrait-8 medium-landscape-5"></div>

prototypinghtmlfoundation5orientation

This question only concerns prototyping; I know it can be done with SCSS mixins, but I'm trying to do something like this – why won't it seem to work?

<div class="medium-portrait-4 medium-landscape-7"></div>
<div class="medium-portrait-8 medium-landscape-5"></div>
Andrew Patterson over 5 years ago

There are no classes medium-portrait-n or medium-landscape-n. The small-n, medium-n and large-n classes may accomplish what you want as long as portrait and landscape views report different browser widths. If they don't then you may be left with using show-for-portrait and show-for-landscape in order to get different views.

Henrik Cederblad over 5 years ago

Zurb: Maybe something for future? I think it'd just make prototyping even quicker being able to target orientations as well with quick HTML classes method.