<div class="container">
 <div class="doc">
  <div class="catpic"><a name="events" href="?a=news&cat=6"><img src="pics/cats/news_event.png" alt="event" /></a></div>
  <h2>first</h2>
  <ul class="cms">
   <li><a href="?a=news&id=1&cms=edit">edit</a></li>
   <li><a href="?a=news&id=1&cms=del">delete</a></li>
  </ul>
  <div class="author">
    <img src="dbe/user/user2/avatar_2_s5yzc1.gif" alt="avatar" /> <a href="?a=user&id=2">veal</a>
    <img src="pics/avatar_star.gif" alt="star" /> wrote @ <i>18:04, 17 Jul 2004 </i>:
  </div>
  <div class="text">
    test text
  </div>
  <div class="numcomments">
    <img src="pics/icons/comment.gif" alt="*" /> <a href="?a=news&id=1#comments">2 Comments</a> 
    <img src="pics/icons/hits.gif" alt="*" /> 38 Hits <br />
    <img src="pics/icons/url.gif" alt="*" /> Link: <a href="http://www.asdf.ch" target="_blank">http://www.asdf.ch</a>
  </div>
 </div>
</div>




// css

div.container {
    border: 1px solid #000;
    background-color: #fff;
    padding: 10px;
    color: #001;
    margin-bottom: 10px;
  }

div.doc {
  }
  /* title */   
  div.doc h2 {
    background-color: #555;
    color:#fff;
    font-family: Arial, sans-serif;
    font-size: 18px;
    padding: 3px 0px 3px 50px;
    margin: 0px;
  }
  div.doc h2 a,
  div.doc h2 a:link,
  div.doc h2 a:active,
  div.doc h2 a:visited {
    color:#fff;
  }
  div.doc div.text {
    margin-bottom:10px;
    color:#000;
    border:1px dotted #f0f;
    background-color:#fee;
    padding:2px 2px 2px 10px;
  }
  div.doc div.author {
    margin: 10px 20px 10px 0px;    
  }
  div.doc div.numcomments {
    background-color:#ddd;
    padding:3px;
    border:1px dotted #003;
  }
  div.doc div.catpic {
    float:left;
    margin:0px 0px 0px 0px;
    padding:0px;
    border:1px solid #000;
  }