fancyBox und Gridiculous

Zum Erstellen kleiner Foto-Galerien nutze ich meistens fancyBox 1.3.4. Es ist im Handumdrehen eingebunden. Doch neulich gab es Probleme auf einer Seite, die das Gridiculous CSS-Framework nutzt. Bei jedem Bildübergang skalierte sich das Bild-umschließende div-Element neu, selbst wenn sich die Bildgröße nicht änderte. Es wirkte als würde beim Übergang das Bild springen. Auch die Buttons waren nicht passend angeordnet. 

Der Grund dafür: Die CSS3 box-sizing Eigenschaft, die Gridiculous auf border-box setzt. Damit fancyBox 1.3.4 auch mit Gridicolous fehlerfrei läuft, muss box-sizing für das umschließende div inklusive der Kindelemente auf content-box gesetzt werden:

#fancybox-wrap, #fancybox-wrap * {
  -webkit-box-sizing:content-box;
     -moz-box-sizing:content-box;
      -ms-box-sizing:content-box;
          box-sizing:content-box;
}
  01.11.14 um 11:35 Uhr
  web, CSS, jQuery
nächster Artikel:
Goldstadt Waihi
auch lesen:
vorheriger Artikel:
Fünf Tage Fjell
auch lesen:

Kommentare

Es sind keine Kommentare vorhanden.

Kommentar verfassen





optional, wird nicht veröffentlicht

optional

Bitte rückwärts eingeben!