HTML Tabelle - Nur Border als Zeilentrenner, oben und unten

[Lutz]

Hi,

ich kann meine Frage schlecht beschreiben, daher versuche ich es mal hoer zu basteln. Ich will eine HTML Tabelle bauen, die so ausschaut:

-------------------
Text Text Text Text
-------------------
Text Text Text Text
-------------------
Text Text Text Text
-------------------

Also, ich will eine HTML Tabelle, die nur aus einer Spalte und mehreren Zeilen besteht. Zwischen den Zeilen soll man den Border sehen können. Ganz oben und ganz unten auch. So wie es mein Beispiel zeigt. Das ganze mit einem 1px solid Border.

Leider habe ich keine Idee ob so was geht und wie so was geht. Nach meinen rescherschen würde ich sagen es geht nicht, aber vielleicht sehen die Profis das anders.

Lutz

[Matthias Apsel]

Om nah hoo pez nyeetz, Lutz!

Ich will eine HTML Tabelle bauen, die so ausschaut:

[ ] - Die Tabelle enthält tabellarische Daten, z.B. Messwerte
[ ] - Die Tabelle soll dafür sorgen, dass die Seite schön aussieht

Matthias

[Lutz]

Weder noch :)

Ich versuche etwas Aufwand beim Erzeugen von online Rechnungen mit TCPDF zu sparen.

Mit den TCPDF Funktionen ist das sehr viel Aufwand, mit HTML wäre dies vermutlich einfacher.

Om nah hoo pez nyeetz, Lutz!

Ich will eine HTML Tabelle bauen, die so ausschaut:

[ ] - Die Tabelle enthält tabellarische Daten, z.B. Messwerte
[ ] - Die Tabelle soll dafür sorgen, dass die Seite schön aussieht

Matthias

[Matthias Apsel]

Om nah hoo pez nyeetz, Lutz!

Weder noch :)

Dann ist es ja eine Tabelle mit mehreren Spalten, nur das die Spaltenbegrenzung links und rechts nicht zu sehen ist.

* Tabellen in HTML
* Tabellengestaltung mit CSS

Matthias

[molily]

Hallo,

eine Tabelle ist dafür nicht notwendig, eine Liste wäre vermutlich angebrachter:

<ul>  
<li>Text</li>  
<li>Text</li>  
<li>Text</li>  
<li>Text</li>  
</ul>

Mit CSS entsprechend formatiert:

ul { margin: 0; padding: 0; border-top: 1px solid black; }  
li { margin: 0; padding: 1em; border-bottom: 1px solid black; }

Mathias

[Gunnar Bittersmann]

@@molily:

nuqneH

ul { margin: 0; padding: 0; border-top: 1px solid black; }

li { margin: 0; padding: 1em; border-bottom: 1px solid black; }

  
Oder (hier nur borders aufgeschrieben):  
  
~~~css
ul { border-top: 1px solid black; border-bottom: 1px solid black; }  
li:not(:first-child) { border-top: 1px solid black; }

Für ältere Browser, die :not() noch nicht kennen, müsste man das allerdings anders schreiben:

ul { border-top: 1px solid black; border-bottom: 1px solid black; }  
li { border-top: 1px solid black; }  
li:first-child { border-top: none; }

Das hat den Vorteil, dass man obere und untere Begrenzungslinie und Zwischenlinien problemlos anders gestalten kann:

ul { border-top: 1px solid black; border-bottom: 1px solid black; }  
li { border-top: 1px dashed silver; }  
li:first-child { border-top: none; }

Qapla'

[Alex]

Hallo!

ul { border-top: 1px solid black; border-bottom: 1px solid black; }

li:not(:first-child) { border-top: 1px solid black; }

>   
> Für ältere Browser, die `:not()`{:.language-css} noch nicht kennen, müsste man das allerdings anders schreiben:  
>   
> ~~~css

ul { border-top: 1px solid black; border-bottom: 1px solid black; }  

> li { border-top: 1px solid black; }  
> li:first-child { border-top: none; }

Oder:

ul { border-top: 1px solid black; border-bottom: 1px solid black; }

li+li { border-top: 1px solid black; }

  
Viele Grüße,  
Alexander

[Gunnar Bittersmann]

@@Alex:

nuqneH

Oder:

ul { border-top: 1px solid black; border-bottom: 1px solid black; }

li+li { border-top: 1px solid black; }

  
Ähm ja, so einfach ist die Welt. ;-) Thx.  
  
Qapla'

-- 
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.  
(Mark Twain)

[Matthias Apsel]

Om nah hoo pez nyeetz, Gunnar Bittersmann!

ul { border-top: 1px solid black; border-bottom: 1px solid black; }

li+li { border-top: 1px solid black; }

>   
> Ähm ja, so einfach ist die Welt. ;-) Thx.  
  
Ich hab das gerade ausprobiert, aber jetzt sind wieder alle Linien gleich :-(  
  
Matthias

-- 
1/z ist kein Blatt Papier.  
![](http://www.billiger-im-urlaub.de/kreis_sw.gif)