Hallo zusammen,
habe eine Frage zu meinem CSS, welches ich gerade für meine Website erstellen.

Zum Aufbau / Hintergrund:
Ich habe eine "Weiche" erstellt, die auf verschiedenen Websites führen soll.
Dazu habe ich 2 Kästen mit Bildern und Text aufgebaut.

Zu meiner Frage.
Im linken Kasten sind oben zwei Bilder (1. Bild und 2. Bild) zu sehen.
Diese sollen beide zentriert nebeneinander stehen.
Aktuell ist es so, das Bild 2 zentriert im <div> steht, das linke (1. Bild) aber links am Rand klebt.
Diese linke Bild bekomme ich einfach nicht zentriert …

Bitte hier live anschauen

Habe z.B. das hier probiert:
Wenn ich in Zeile 24 „align="left“ eingebe, stehen die beiden Bilder zwar nebeneinander, aber das 1. Bild klebt links am Rand.
Wenn ich in Zeile 24 „align=„center“ eingebe, stehen die beiden Bilder wieder untereinander.

(Das ganze soll auch responsiv funktionieren …)

Hat jemand einen Tipp für mich, was an meinem Code nicht stimmt?


Vielen Dank
Gerhard

align gibt es nicht mehr und hat auch nichts mit CSS zu tun. Wenn du etwas ausrichten willst, dann verwende doch bitte auch CSS dafür.
Wozu brauchst du hier so viele verschachtelte divs, räume hier deinen Code doch etwas auf.

Zentrieren kannst du ein Bild, indem du text-align: center verwendest. Für einfaches zentrieren von mehreren Elementen verwende Flexbox.

Als Erstes solltest du deinen Code überprüfen... zB gleich in Zeile 6 hast du ein ..
stehen. Es fehlt dort ein doppeltes Anführungszeichen!!!
Richtig wäre
So wie es da steht hast du den gesamten restlichen Code in Anführungszeichen gesetzt... eigentlich müsste der Browser das unzerkaut wieder ausspucken !

Nutze am besten mal den w3c Validator.
https://validator.w3.org/

und die anderen Zeilen wo eine rote Zahl vorsteht beinhaltet auch Fehler. In deinen Fall ist das meistens ein ; zu viel, oder halt ein anderer Fehler wie hier schon gesagt wurde

Danke "cloned" für den Code-Schnipsel, und danke "Sailor56, basti1012" für den Tipp mit dem w3c Validator. Der ist wirklich sehr hilfreich.

Habe den Code jetzt mal überarbeitet und muss nun nur noch rausfinden, wie ich den beiden zentrierten Bildern im linken Kasten etwas Abstand nach oben gebe.

Viele Grüße
Gerhard

wie wäre es mit margin-top:25px; bzw padding-top; jenachdem was du genau vor hast

schön, dass es funktioniert. Du kannst natürlich auch das ganze mit einer Klasse lösen und der Klasse diese inline-styles hinzufügen, ich habe das nur quick & dirty gelöst.

Den Abstand kannst du erreichen indem du den Bildern einen margin-top gibst oder hier würde ich es fast besser finden, dem Container der Bilder ein padding-top geben, da der Abstand ja zum Container sein soll und unabhängig vom Inahlt sein soll. Dann kannst du auch mal einen Paragraph, etc. einfügen und hast immer den Abstand.

Nochmals danke
Jetzt sieht es gut aus.

Euch allen einen schönen Tag!