Dominik: css-Tabelle : Zellendarstellung abhängig voneinander.

Beitrag lesen

SELF-Forum

css-Tabelle : Zellendarstellung abhängig voneinander.

Dominik Homepage des Autors
– Informationen zu den Bewertungsregeln

Liebe Foristen,

es wird gesagt, eine Tabelle aus divs, die mit display: table, table-row und table-cell formatiert ist, verhalte sich genau wie eine aus den entsprechenden html-Elementen.

Ich habe ein Beispiel, wo das offensichtlich nicht der Fall ist:

<html>  
<head>  
<style>  
  .tabl , table {display: table; width: 500px; border: blue 1px solid;}  
	.ro {display: table-row;}  
  .ce , td{display: table-cell; border: red 1px solid;}  
	.z1 {line-height: 50px;}  
</style>  
</head>  
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">  
<div class="tabl">  
  <div class="ro">  
    <div class="ce">  
      <p>Hier steht ein Text, der eigentlich oben sein müsste. Jetzt mach ich das Ding noch viel länger, mal sehen, wie das mit dem Umbruch hinkriegt.</p>  
			<p>Dann kommen hier nocht ein paar weltbewegende Zeilen.  
			<br>ein kleines Line-Break tun wir auch noch rein.</p>  
    </div>  
    <div  class="ce">  
      <p class="z1">So hier kommt eine mächtige erste Zeile...</p>  
<!-- <img src="Graph/Dagmar Cee/dagmar 135 180.jpg" alt="" border="0" width="140" height="192">b -->  
  
    </div>  
  </div>  
</div>  
  
</body>  
</html>

Der Text in der linke Zelle liegt so, dass seine erste Zeile mit dem Bild in der rechten Zelle dieselbe Grundlinie teilt. Der gleiche Effekt tritt auf, wenn ich in einer der beiden Zellen größere Buchstaben oder Zeilenhöhen reinschreibe.

<grantel class="kannüberlesenwerden">Wieder ein typisches Beispiel dafür, wie der CSS - Standard vorwegnimmt, was einige Anwender vielleicht erwarten könnten, alle anderen aber daran hindert, das zu tun was sie wollen.</grantel>

Hat jemand eine Idee, wie man das ausschalten kann?

alles beste...

Beitrag melden
–
Informationen zu den Bewertungsregeln