Hängender Einzug (Datum, Titel von News)

zum · 18. Oktober 2004

Ich versuche ein Tabellenlayout mit einem sauberem CSS-Design nachzubauen. Die Newsseite hat dabei bei jeden neuen Beitrag das Datum links und den Titel sowie danach darunter den Beitrag in der rechten Spalte.

(siehe http://www.humbel.net/)

Wie kann ich das semantisch korrekt nachbauen, so dass beim Editieren der Benutzer einfach Klassen und Tags zuordnen kann: h3.datum, h3, p.

Da die Seite mit einem Tool editiert wird, kann ich keine verschachtelte divs gebrauchen. Dies äre ja ohnehin kein wirklicher Ersatz für Tabellen...

Fabian H · 18. Oktober 2004

Da die Seite mit einem Tool editiert wird, kann ich keine verschachtelte divs gebrauchen. Dies äre ja ohnehin kein wirklicher Ersatz für Tabellen...

Wieso sollten verschachtelte Divs kein Ersatz fuer Tabellen sein?

Naja, deine News koenntest du jedenfalls folgendermassen mit CSS schreiben: (Benutzt aber verschachtelte Tabellen und das Datum ist leider ueber der Ueberschrift angebracht; sieht ein bisschen doof aus in einem Textbrowser oder ohne Stylesheet):

Code:

<html>
  <head>
    <style type="text/css">
  
      div.News span {
        display: block;
        float: left;
        width: 140px;
      }
  
      div.News div {
        margin-left: 140px;
      }

      div.News img {
        float: left;
     }
 
    </style>
  </head>
  <body>
    <div class="News">
      <span>18.10.2004</span>
      <div>
        <h3>Newstitel</h3>
        <p>
          <img src="newsimg.png" width="30" height="30" alt="Bild" />
          Newstext, test 123
        </p>
      </div>
      <hr />
    </div>
  </body>
</html>

Hängender Einzug (Datum, Titel von News)

zum

Grünschnabel

Fabian H

Neue Beiträge