code-tutorial.com

The best resources for developers

HTML Comments Markup Markup.

.comment {
  width: 400px;
}

.comment_img {
  float: left;
}

.comment_text,
.comment_meta {
  margin-left: 40px;
}

.comment_meta {
  clear: both;
}
<div class="comment" id="comment_(comment id #)">
  <div class="comment_img">
    <img src="https://placehold.it/100" alt="(Commenter Name)" />
  </div>
  <div class="comment_text">
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p>
    <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p>
  </div>
  <p class="comment_meta">
    By <a href="#">Name</a> on <span class="comment_date">2008-08-21 11:32 AM</span>
  </p>
</div>

Tags: html semantic-markup

Source: By GateKiller as answer to the question

This code snippet was collected from stackoverflow, and is licensed under CC BY-SA 2.5


Related code-snippets: