Ergebnis 1 bis 7 von 7

Thema: Tabelle breiter als Inhalt - warum?

  1. #1
    Unregistriert
    Gast

    Standard Tabelle breiter als Inhalt - warum?

    Hallo,
    ich zerbreche mir den Kopf über die Berechnung der Tabellenbreite. Vielleicht kann mir Jemand helfen?

    Folgende Tabelle inklusive aller enthaltener Elemente ist völlig frei von irgendwelchen Breitenangaben. Bloß ein {Border-spacing: 5px}.
    Trotzdem wird sie breiter als sie muss.
    Ich möchte in einem Formular erreichen, dass sich die beiden einzigen Zellen <td colspan="2">Straße</td> und <td>Hnr.</td> in der ersten Zeile mit den beiden Zellen <td>PLZ</td> und <td colspan="2">Ort</td> in der zweiten Zeile platzsparend verschachteln. Tun sie aber nicht. Jedenfalls nicht so weit wie möglich. Müsste sich die Gesamtbreite nicht aus der Summe der Zellenbreiten der breitesten Reihe ergeben?
    Ich kann das gewünschte Verhalten erzwingen, indem ich eine zusätzliche Reihe mit drei Zellen einfüge, deren mittlere Zelle durch Inhalt aufgespannt wird (in meinem Beispiel die auskommentierte erste Zeile).

    <table>
    <!--<tr>
    <td>
    </td>
    <td>
    blabla
    </td>
    <td>
    </td>
    </tr>-->
    <tr>
    <td colspan="2">
    StraßeStraße
    </td>
    <td>
    Hnr.
    </td>
    </tr>
    <tr>
    <td>
    PLZ
    </td>
    <td colspan="2">
    OrtOrtOrt
    </td>
    </tr>
    </table>

    Freue mich über Erleuchtung,

    im Dunkeln, Daniela
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Großmeister(in)
    Registriert seit
    04.08.2009
    Beiträge
    574
    Danke
    0
    Bekam 67 mal "Danke" in 65 Postings

    Standard AW: Tabelle breiter als Inhalt - warum?

    Hallo,

    mal abgesehen davon, das Tabellen nur für Tabellendaten benutzt werden sollten, fehlen dir wohl die HTML/CSS-Grundlagen.

    Zum einen werden alle Spalten einer Tabelle jeweils gleich breit.

    Zum anderen hat jeder Browser sein eigenes Layout mit seinen eigenen Breitenangaben, das er anwendet, wenn ihm keine (CSS-)Angaben mitgeliefert werden.

    Am besten wäre es, wenn du ein Online-Beispiel zeigen könntest. Aus deiner Beschreibung ist dein Problem nicht wirklich nachvollziehbar.

    Gruss

    MrMurphy

  3. #3
    Unregistriert
    Gast

    Standard AW: Tabelle breiter als Inhalt - warum?

    Hallo MrMurphy,

    für eine so kurze und vage Antwort erstaunlich viele falsche Aussagen ...

    Tabellen sind für Tabellendaten ... ach was?
    Vielleicht meinst Du damit, dass sie nicht für Seiten-Layout missbraucht werden sollen. Für die Anordnung von Formularfeldern sind sie trotzdem zu empfehlen.

    Ohne Größenangaben in CSS oder HTML (und z.T. auch mit) werden die Zellen vom Inhalt aufgespannt.

    Alle Tabellenspalten sind gleich breit? Natürlich falsch.
    Vielleicht meintest Du, dass alle Zellen einer Spalte gleich breit sind? Bei Verwendung von colspan≠1 auch falsch.

    Soviel zu den Grundlagen ...

    Das beschriebene Verhalten kannst Du mit meinem Codeschnipsel (dessen Einrückungen leider verloren gegangen sind) in Deinem Browser nachstellen.

    Gruß, Daniela

  4. #4
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Tabelle breiter als Inhalt - warum?

    Es gibt hier im Editor 3 verschiedene Code-Tags zur Auswahl. Zu finden 2. Zeile rechts, wenn man Javascript eingeschaltet hat.
    Bitte beim nächsten mal verwenden.

    Für die Anordnung von Formularfeldern sind sie trotzdem zu empfehlen.
    Nein sind sie nicht, auch wenn man das häufig sieht, wird es dadurch nicht richtig.

    Für Formulare gibt es eigene Tags zum Beispiel Label und Fieldset.
    Formatierungen werden dann im CSS vorgenommen.

    Dazu bedarf es keiner Tabelle.

    Eine Tabelle sollte nur für die Ausgabe von tabellarischen Daten herangezogen werden, Formulare haben aber Eingabefelder, das widerspricht der Semantik und Logik.
    Demzufolge baust du doch ein Layout mit Tabellen nach, auch wenn es nicht auf die gesamte Seite angewendet wird.

  5. #5
    Unregistriert
    Gast

    Standard AW: Tabelle breiter als Inhalt - warum?

    Hallo Explanator,

    wenn ich schrieb, dass Tabellen sich für Formular-Layout empfehlen, meinte ich nicht, dass man es immer so machen sollte.
    In meinem speziellen Fall eines etwas komplexeren und dynamischen Anmeldeformulars, wo zu den Eingabefeldern neben den Labeln auch Informationen zu z.B. Preisen inkl. Ermäßigungen zugeordnet werden, hat es sich mal wieder bewährt. Insbesondere, wenn im Fall einer falschen Eingabe eine variable Anzahl an Fehlermeldungen über oder unter dem Eingabefeld aufploppen soll (NOCH verlasse ich mich nicht auf HTML5-Attribute und auch nicht auf Aktivierung von JavaScript). In einer Tabelle behalte ich eine bessere Übersicht über die Ausrichtung der Reihen (das Geschubse mit colspan war hier die Ausnahme und nicht die Regel).

    Unabhängig von der Verwendung von Formularfeldern würde mich jetzt aber generell interessieren, wie ein Browser bei der Berechnung der Zellenbreite im Falle von colspan≠1 vorgeht.

  6. #6
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Tabelle breiter als Inhalt - warum?

    Laut Definition überspannt colspan die Anzahl nachfolgender TD-Elemente.

    Die Breite einzelner Td-Elemante wird mit CSS festgelegt, oder vom Inhalt, wenn unbestimmt.

  7. #7
    Interessierte/r Avatar von Friedel
    Registriert seit
    18.09.2008
    Ort
    Weingarten/Pfalz
    Beiträge
    102
    Danke
    1
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: Tabelle breiter als Inhalt - warum?

    Deine Tabelle wird tatsächlich imho nicht bestimmungsgemäß eingesetzt. Auch wenn ich keinen Grund zur Annahme habe, dass du darin keine tabellarischen Inhalte darstellst, missbrauchst du zwar vielleicht nicht das table-Element, aber die Spaten und Zellen.

    Trotzdem lässt sich dein Problem lösen, wenn ich die Lösung für ebenso unsauber wie deinen Missbrauch der Spalten halte. Füge einfach, am besten als erste Zeile eine leere Zeile mit 3 Zellen ein und teile das ganze mit colgroup und col ein. Dann kannst du in den col z.B. festlegen, dass die erste Spalte nur 5 em breit sein soll und die letzte soll z.B. 6em breit sein. Postleitzahlen haben nur 5 Stellen, für eine Hausnummer sollten 6 Stellen auch reichen. Das ganze könnte dann z.B. so aussehen:

    HTML-Code:
        <table>
          <colgroup>
            <col width="5em">
            <col>
            <col width="6em">
          </colgroup>
          <tr style="visibility:hidden">
            <td></td>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <td colspan="2">
              StraßeStraße
            </td>
            <td>
              Hnr.
            </td>
          </tr>
          <tr>
            <td>
              PLZ
            </td>
            <td colspan="2">
              OrtOrtOrt
            </td>
          </tr>
        </table>
    Um deine zusätzliche Zeile wirst du imho nicht herumkommen, denn die Render-Engine bzw. deren Algorithmus wird die Spaltenbreite sonst nicht berechnen können.

    P.S. Statt visibility:hidden kannst du natürlich nicht display:none verwenden, denn sonst wird die Zeile ja nicht gerendert.
    Geändert von Friedel (11.08.2013 um 03:36 Uhr)

Ähnliche Themen

  1. bei Tabelle Inhalt oben positionieren
    Von Philipp02 im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 05.09.2007, 17:39
  2. Dynamische Tabelle bei externem Inhalt?
    Von Jan-Remmer Harms im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 14.05.2007, 22:27
  3. Inhalt in der Tabelle wird mittig wiedergegeben.
    Von -FATALITY-> im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 25.07.2006, 18:08
  4. tabelle. warum immer in der mitte???
    Von im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 05.05.2005, 22:21
  5. tabelle - höhe an den inhalt automatisch anpassen
    Von |o|o im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 27.02.2005, 21:21

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •