Rolf B: Probleme mit Karte

Beitrag lesen

problematische Seite

Hallo borisbaer,

also zunächstmal solltest Du was wegen background.webp unternehmen. Diese Elefantenhaut ist 4MB groß und lädt, als müsste der Elefant sie persönlich vorbeibringen. Aus Indien… So ein Muster muss man doch durch Kachelung deutlich kleiner bekommen.

Dieser Layout-Bug ist echt subtil.

Die Verschiebung rührt daher, dass deine Checkboxen in divs stecken. Diese divs positionierst Du, und die Checkboxen stecken als INLINE-Element da drin. Ein Inline-Element ist aber ab Werk an die Baseline der Schriftzeile gebunden, und DIE verschiebt sich mit der font-size. Und das tust Du bei Medienwechseln: font-size: 90%.

Lösungsideen:

  • gib den Checkboxen in den divs ein vertical-align:top, dann sind sie nicht mehr an die Baseline gebunden. Du musst dann allerdings alle y-Koordinaten der divs nachjustieren
  • unprobiert: lass die divs weg und positioniere die Checkboxen absolut - ich vermute aber, dass das am gleichen Problem leidet
  • da Du die Größe der .marker.items divs auf 9.5px x 9.5px festnagelst, kannst Du auch die Fontsize darin festnageln. Damit bleibt die Baseline wo sie ist. Das ist vermutlich der geringste Aufwand.

Rolf

--
sumpsi - posui - obstruxi