Tabellenformatierungsproblem

  • Hallo,


    ich möchte für meine Firma ein Entwicklungslastenheft online stellen, wo der User seine Anforderungen etc eintragen kann.


    Das ganze möcht ich als Tabelle machen, in der die 1. Spalte die danebenstehenden Spalten beschreibt. Das Grundgerüst steht auch schon, nur weiß ich nicht wieso ich einen so großen Abstand zwischen Spalte 1 und Spalte 2 habe.

    Woran könnte das liegen?




    tabelle.png

  • kannst du mal den rest code zeigen .ich sehe kein abstand. zumindest weissich nicht was du meinst .wenn du das meist das die nächste reihe die von oben nach unten so weit weg ist ( bei dir auf bild gar nicht zusehen) läst sich das in der css einstellen bzw im html. kannst du mal den vollständigen code zeigen



    auserdem hast du hier ein gänsefüsschen vergessen. vieleicht reicht das auch schon


    Code
    1. <td rowspan="8" style="transform:rotate(270deg);text-align:center; width:5%;" valign="top">Projektinformationen</td>
  • Hey,


    du meinst wohl den Abstand zwischen Projektinformationen und den weiteren Tabellenrows?


    Das liegt daran, dass es valign in CSS3 nicht gibt.


    Das Zauberwort ist vertical-align.


    So sollte es klappen:

  • Ja genau ich meine den Abstand zwischen Produktinformationen und den anderen Tabellenzeilen


    Also Vertical Align bringt mich der Sache schon näher, aber mir scheint es als wäre das Tabellenfeld, in dem Produktinformationen steht, zu groß

    Wenn ich vertical-align:bottom nutze, erscheint "Produktinformationen" in den Tabellenzeilen rechts daneben. (s. Anhang) tabelle-bottom.png

    Ich wollte das mit width:5% regeln, aber aus irgendeinen Grund wird ab X % die Spalte nicht mehr kleiner. Wenn ich bspw. width:1% mache,ist die Spalte genau so groß wie bei 5% --- wenn ich aber width:75% mache, dann wird die Spalte auch tatsächlich größer


    PS: Die roten Rahmen im Bild zeigen wie ich mir das eigentlich gedacht hatte


    Basti : das ist schon der vollständige Code oben, mehr hab ich nicht

  • Ja genau so soll das am Ende aussehen

    Werde das nachher auch mal mit margin probieren, nur mit Prozent- statt absoluten Zahlen.


    Aber interessehalber würd mich trotzdem noch interessieren wieso die Spalte so groß ist, obwohl ich die Größe mit width eingestellt hatte.

  • Hey,


    mein Beispiel gibt das selbe wie Bastis Beispiel aus. Desweiteren habe ich etwas rumgetestet.


    Wie hast du es eigentlich mit der Befüllung der Tabelle gedacht?


    Hier ist eine andere Variante ohne Tabelle (auch schon responsive):


  • Ich wollte jetzt unter den Produktinfos exakt dasselbe darstellen nur statt in der "1. Spalte" Lager / versand / Gewicht stehen soll statt Produktinfos,

    irgendwie zerhaut der mir das aber und schreibt alle 3 Wörter untereinander, weswegen dass dann nicht mehr gut aussieht. (s. Screenshot)

    Woran könnte das liegen?
    bild.png


    hier noch der Code

  • Die IDs ändere auch noch ab aber danke für den Tip


    Ich hab das jetzt soweit alles abgeändert (bis auf Klassen), ich musst aber "height:100vh;" raus löschen -> wofür war das gewesen?


    Allerdings steh ich nun auch schon vor dem nächsten Problem, das ist jetzt natürlich alles unendlich lang und wird so wahrscheinlich selten zum Abschluss gebracht.
    Mein Gedanke wäre, dass man ähnlich wie in folgenden Google Formular , zwischen den einzelnen Abschnitten blättern kann. Wie könnte ich das am geschicktesten umsetzen?

    Das Google Formular würde ich auch nehmen, allerdings bekomm ich es nicht hin, dass die Höhe sich an die Abschnitte anpasst, kann nur mit px angaben arbeiten (height:100% oder height:auto funktioniert nicht, wenn ich den height wert gänzlich weg lasse, passiert auch nichts) und das sieht komisch aus und wird vorallem auf dem Handy wahrscheinlich mehr schlecht als recht ausschauen.