Detlef G.: mehrzeiliges display:table-cell hat Lücken

Beitrag lesen

SELF-Forum

mehrzeiliges display:table-cell hat Lücken

Detlef G.
– Informationen zu den Bewertungsregeln

Hallo Carsten77

Anstatt mit Tabelle, habe ich vor ein paar Tagen gelesen, kann man mit Divs ein Tabelle simulieren.

Wer schreibt denn so einen Blödsinn?
Es stimmt, dass Tabellen nicht fürs Layout missbraucht werden sollen. Es ist aber überhaupt nicht besser, <div>s anstatt von Tabellenelementen zu verwenden!

Der Sinn der Verwendung von CSS besteht darin, das HTML der Seite logisch (semantisch) zu strukturieren und im CSS zu beschreiben, wie es dann dargestellt werden soll.

Ich wollte gleich mal versuchen, eine Box mit runden Ecken damit zu basteln.

Das ist bei Seiten mit festen Breiten sehr einfach.

Das, was du gemacht hast, ist eine unbekömmliche Div-Suppe.
Lobenswert ist, dass du die Navigation als Liste ausgeführt hast, aber keine Überschrift, kein Absatz, nur <div>.
Dein HTML sollte etwa so aussehen:

<body>  
  <div id="LAYOUT">  
    <div id="HEAD">  
      <h1>  
        <a href="index.html"><img src="images/page_logo.png" alt="Carsten Schrick"></a>  
      </h1>  
      <ul id="SPECIAL">  
        <li><a href="kontakt.html">Kontakt</a></li>  
        <li><a href="impressum.html">Impressum</a></li>  
        <li><a href="gaestebuch.html">Gästebuch</a></li>  
      </ul>  
      <ul id="NAVIGATOR">  
        <li><a href="start.html">Start</a></li>  
        <li><a href="aktuelles.html">aktuelles</a></li>  
        <li><a href="projekte.html">Projekte</a></li>  
        <li><a href="links.html">Links</a></li>  
       </ul>  
    </div>  
    <div id="CONTENT">  
      <!-- hier dann der eigentliche Inhalt -->  
      <h2>Unterüberschrift</h2>  
      <p>der Text dazu</p>  
      <!-- usw. -->  
    </div>  
    <ul id="FOOTER">  
      <li>&copy;2009 Carsten Schrick</li>  
      <li>&sim;</li>  
      <li>v0.5</li>  
    </ul>  
  </div>  
</body>

Wie du siehst, ist es durchaus übersichtlich und auch ohne CSS ist alles übersichtlich und gut benutzbar. Es dürften auch ausreichend Elemente vorhanden sein, um dein gewünschtes Design ohne Änderung der HTML-Struktur nur mittels CSS umzusetzen.

PS: Ist der Footer wirklich eine Liste (Auflistung)?
    Für mich seiht es eher so aus, als ob es nur eine Textzeile wäre, dann also:
    ~~~html <div id="FOOTER">
      &copy;2009 Carsten Schrick &sim; v0.5
    </div>

  
Auf Wiederlesen  
Detlef  

-- 
- Wissen ist gut  
- Können ist besser  
  
- aber das Beste und Interessanteste ist der Weg dahin!
Beitrag melden
–
Informationen zu den Bewertungsregeln