Probleme mit Karte

[borisbaer]

Hallo Rolf,

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.

das verstehe ich nicht ganz. Bei mir ist die Bild-Datei ca. 4 Kilobyte groß. 😵

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%.

Danke, das wusste ich nicht!

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.

Ich habe die erste Lösungsmöglichkeit gewählt, erschien mir am sinnvollsten.

Vielen Dank für die schnelle Hilfe! 🙂