Kleine Sektflaschen Hochzeit
Letztens war ich auf der suche, wie man ein quadratisches DIV erzeugen kann, was sein Höhe automatisch an der Breite angepasst hat. Mit einen kleinen Hinweis kam ich auf folgende Ideen: Mit einem Bild Mit Javascript Mit CSS Quadratisches Bild. Die Bildlösung ist natürlich am einfachsten. Wenn das Bild quadratisch ist, so wird dies mit folgendes CSS Einstellungen immer quadratisch angezeigt. img { width: 100%; height: auto;} In diesem Fall bezieht sich height: auto immer auf die Breite und proportionen des Bildes. Html quadrat erstellen in english. Da das Bild schon quadratisch ist, bleibt das Bild auch nach der veränderung der Breite quadratisch. Dieses vorgehen lässt sich leider nicht auf DIV Boxen anwenden. Quadratische DIVs per Javascript: Diese Lösung ist ebenfalls sehr simpel. Nachdem die Seite aufgebaut ist, wird per Javascript die Breite des Elementes ausgelesen und als Höhe gesetzt. Diese Lösung hat bis jetzt den Nachteil, dass Sie zwar beim ersten Aufruf die DIV Boxen in der Höhe anpassen, jedoch nach dem verändern der Breite leider nicht nochmals anpassen.