[ERLEDIGT] Text neben Bild ausrichten, float-Problem?

[dortcom]

Hallo zusammen,

ich habe hier mal ein Bild von meinem Problem angehängt (siehe rote Pfeile):

Der Text neben dem Bild verhält sich unterschiedlich. Es soll so sein, dass der Text neben dem Bild steht (so, wie auf der linken Seite). Auf der rechten Seite wird das Bild aber vom Text umflossen.

Ich finde den Fehler einfach nicht. Es wäre klasse, wenn jemand helfen könnte. Vermutlich ist es ein float-Problem.

Das Ganze läuft im Footer auf http://www.agile-master.de/

Danke und Grüße
dortcom

 

[SpiceLab]

Ein denkbarer Lösungsansatz ist das Flexbox-Modell auf das umschliessende <li> anzuwenden, um die gewünschte Spaltenordnung einzurichten.

aside.widget ul li {
  padding: 0 0 7px 0;
  line-height: 1.4em;
  display: flex;
}

Sofern Flexbox noch nicht bekannt ist:

1. https://blog.kulturbanause.de/2013/07/einfuhrung-in-das-flexbox-modell-von-css/
2. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
   
3. http://www.w3schools.com/css/css3_flexbox.asp

 

[dortcom]

Hallo Spicelab,

danke für den Tipp. Flexbox kannte ich noch nicht. Ich hab´s ausprobiert. Es führt mich allerdings zu folgendem Verhalten:

Ich hatte noch den Unterschied gefunden, dass die Bilder auf der linken Seite keine Links waren und die auf der rechten Seiten hatten einen Link hinterlegt. Ich habe das angepasst, das hat mich aber auch zu keine Ergebnis geführt.

Das float: left; habe ich auf dem Thumbnail.

Ich wäre für weitere Hilfe dankbar.

Grüße
dortcom

 

[SpiceLab]

Bist Du mit dem integrierten Entwicklerwerkzeug Deines Browsers nicht vertraut, um das zu analysieren, bzw. weißt Du nicht, welche Elemente an dieser Stelle des HTML-Codes involviert sind, und welche CSS-Formatierung sie besitzen?

Ursache ist diese Klasse:

.footer-widget-content {
  margin-left: 55px;
}

 

[dortcom]

Hallo Spicelab,

doch, ich bin mit den Werkzeugen vertraut, aber kein Profi. Ich hatte die beteiligte Klasse nicht gefunden. Danke für deine Hilfe, jetzt funktioniert´s.

Grüße und lieben Dank
dortcom