2 Bilder nebeneinander

  • Guten Abend,

    ich wollte mich mal erkundigen wie ich 2 Bilder nebeneinander machen kann, mit einem Text.


    Derzeit sieht es bei mir so aus:

    [Blockierte Grafik: https://abload.de/img/bild1ousx6.png]


    ich möchte allerdings das die beiden nebeneinander sind, inkl. Text.


    Mein HTML Code:

    Code
    <!-- Hier fängt die 'Manager' Gruppe an! -->
      <div class="rush"><br />
      <p>Server Managment</p><br />
      <img src="img/RushLP.png" alt="" border="0">  </div>
      <p class="name2">GleichZeitig_YT</p>
    
      <div class="cloud">
      <img src="img/RushLP.png" alt="" border="0">  </div>
      <p class="name2">GleichZeitig_YT</p>
    <!-- Hier endet die 'Manager' Gruppe! -->


    Hier mein CSS Code:


    Liebe Grüße!

  • Hi CuzImCloud,

    ich bin hier nicht als Experte im Forum bekannt, aber es gibt viele Wege die nach Rom führen.

    Durch die Verwendung der <p> und <div> Tags auf die einzelnen Zeilen gibst Du dem Ganzen quasi einen >Return< und das nächste Element positioniert sich darunter. Probiere einfach mal die <p> und <div> tags rauszulassen und dann siehst Du was ich meine.

    Code
    <p>Server Managment</p><br />
      <img src="XXX.png" alt="" border="0" width="100">
      GleichZeitig_YT
    
      
      <img src="XXX.PNG" alt="" border="0" width="100">
      <p class="name2">GleichZeitig_YT</p>

    Das kann man sicher dann für Dein Gusto codieren.

    <figure> wäre eine Möglichkeit. Hier ein Beispiel: http://wiki.selfhtml.org/wiki/CSS/Tutor…dunterschriften

    Man kann aber sicher auch mit <float> in CSS was machen.

    Wie gesagt: Viele Wege nach Rom. Es kommt halt darauf an was Du am Besten brauchst.

    Just my 5 Cents.

    Einmal editiert, zuletzt von olkostbe (6. März 2018 um 18:12) aus folgendem Grund: Korrektur

  • Vielen Dank!!

    Ich habe es geschafft die Bilder zu zentrieren, jedoch die letzte Frage:

    Wie kann ich den Abstand zwischen den beiden verringern?

    Zentriert habe ich es mit "margin: auto;"

    Aber dann ist ein sehr großer Abstand dazwischen.


    Gruß!

  • Vielen Dank.

    Ich muss echt noch ein wenig lernen.

    Ich habe jetzt das mit "child" gemacht.

    Wie muss ich des machen wenn ich noch ein 3 Teammitglied hinzufügen möchte?

    Nutze derzeit wie gesagt:

    Code
     nth-child(2) {

    Wie in deinem Link

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!