zwei Spalten & Text mittig neben Bild

  • Hallo,

    ich bin gerade eine Vereinsseite am erstellen. Dabei habe ich folgendes Problem, welches ich nicht mit Tabellen gelöst bekomme.

    Ich möchte eine Seite mit dem Kader einer Fußballmannschaft erstellen. Dort soll zum einen jeder Spieler mit einem Bild und Name erwähnt werden.

    Mein Problem liegt darin:
    1. Spieler sollen in zwei Spalten gelistet werden (siehe Screenshot)

    2. Jeder Spieler erhält ein Bild wo neben dran der Name des Spielers mittig steht.


    Ich habe es mit einer Tabelle ausprobiert, jedoch wird der Name des Spielers dann nicht mittig neben das Bild gestezt, sonder unten links neben das Bild.

    Ich habe mit Photoshop die Seite entworfen, damit Ihr seht was ich meine.

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • habs jetzt mal genauer studiert und noch mal probiert, leider das geliche ergebnis. wenn ich jedoch den html-Code in Dreamweaver kopiere wird es richtig dargestellt. So siehts aber in Wordpress aus - siehe Anhang.

  • Im visuellen Modus wird die tabelle wohl nicht sauber generiert. Baue mit dem WP Editor im HTML-Modus die Tabelle nach den Vorgaben aus selfhtml auf, dann läufts so wie du es baust.

    Einmal editiert, zuletzt von bgeissler (5. August 2010 um 19:02)

  • Mach es doch so:

    Erstell dir ne Div-Box und style diese über CSS. Dann kannst du soviele Div-Boxen einfügen wie du möchtest... kannst dann aber nur in der HTML-Ansicht arbeiten, aber dies wäre wohl die einfachste und sauberste Lösung...

    Der Code könnte so aussehen:


    Die Div-Box baust du dann so auf:

    Code
    <div class="kader">
    <img src="deinbild.jpg" alt="Beschreibung"/>
    Hier dein Text, der neben dem Bild erscheinen soll
    </div>

    Dies ist nur ein Lösungsansatz! Du müsstest dann noch ein paar Variablen dazufügen, dass die Formatierung stimmt...


  • danke für die antworten. hätte nicht gedacht das es doch so kompliziert ist. habe schon diverse plugins "column" ausporbiert jedoch ohne erfolg.

    danke für euere ansätze.

  • kann mir evtl jemand eine zeile mit 4 spalten als beispiel erstellen so wie ich es haben will, dann kann ich mich daran orientieren

    4 spalten
    1 spalte bild
    2 spalte text (mittig links ausgerichtet neben bild)
    3 spalte bild
    4 spalte text (mittig links ausgerichtet neben bild)

  • Kopiere den Code im HTML-Modus des WP-Editors in die Seite:

    HTML
    <table border="1" width="100%" height="100%">
           <tr><td>Bild<td>Text</td><td>Bild<td>Text</td></tr>
           <tr><td>Bild<td>Text</td><td>Bild<td>Text</td></tr>
           <tr><td>Bild<td>Text</td><td>Bild<td>Text</td></tr>
    </table>

    Height habe ich nur zur Demonstration angegeben. Sie wird sonst durch die Textlänge oder die Bildhöhe bestimmt.

  • Ok habe ich gemacht. Dank für die Hilfe aber es sieht immer noch nicht so aus.
    Der Text "Max Mustermann, Geburtstag, Details" steht in der zweiten Spalte jedoch nicht mittig neben dem Bild aus der 1. Spalte.

    Siehe Screenshot..

  • habs gerade mal mit einem anderen Browser probiert. Nutze normalerweise Safari als Mac-User nun habe ich es mal mit Firefox getestet. sieht schon besser aus aber immer noch nicht sauber so wie ich es gerne hätte.

Jetzt mitmachen!

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