Selv om rutenett/banner-størrelsene baserer seg på en matematikk som går opp så kan man allikevel havne i noen problemer. Dette har som regel med ulikheter i hvor mye bredde en modul fyller på desktop (store skjermer) kontra mobil.
Bredde ( høyde-varianter) | Desktop | Mobil | small (2) | 4 i bredden (25%) | 2 i bredden (50%) | medium (3) | 2 i bredden (50%) | 1 i bredden (100%) | large (3) | 1 i bredden (100%) | 1 i bredden (100%) |
---|
Hull i visning på mobil
På mobil vil noen oppsett skape "hull":
Alle varianter av:
- desktop: small (25%) + medium (50%) + small (25%) = OK
- mobil: small (50%) + medium (100%) + small (50%) = Skaper hull!
Hadde det i stedet vært to small moduler etterfulgt av en medium ville dette fungert greit.
Dersom man vil beholde dette oppsettet, men få det til å fungere bedre på mobil så må man tvinge "small"-modulene til å ta 100% i slike tilfeller. Dette kan gjøres ved å påføre (skrive inn) en cssKlasse; mobil-100 på den eller de problematiske modulene slik bildet nedenfor viser.