This repository has been archived on 2024-03-16. You can view files and clone it, but cannot push or open issues or pull requests.
orbit-4-1/public/demo/comments_1.html

92 lines
2.9 KiB
HTML
Raw Normal View History

2010-01-08 08:05:58 +00:00
<link rel="stylesheet" href="../stylesheets/easy.css" media="screen" />
<style>
/* COPY START HERE */
.comments, .comments ul, #comments li{
margin:0;
padding:0;
list-style:none;
}
.comments li{margin:0 0 1.5em 0;position:relative;}
.comments .meta{margin-bottom:.5em;}
.comments .meta li{
margin:0;
display:inline;
color:#777;
}
.comments .meta .author{
font-size:14px;
font-weight:bold;
}
.comments .meta img{
position:absolute;
left:0;
top:2.5em;
z-index:100;
border:1px solid #ccc;
}
.comments .body{
border-top:1px solid #ccc;
padding-top:1em;
padding-left:70px;
}
/* COPY END HERE */
</style>
<div id="container">
<div class="main">
<!-- COPY START HERE -->
<ol class="comments">
<li>
<ul class="meta">
<li class="image"><img src="http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?s=48" alt="Author's name" /></li>
<li class="author"><a href="#">Author's name</a></li>
<li class="date">posted on September 23rd, 2009</li>
</ul>
<div class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse at enim augue, et luctus odio. Duis porttitor orci id arcu consequat varius.
Pellentesque tempus augue sed purus facilisis vitae feugiat sem convallis. Maecenas a dolor velit.
Ut tempus elit et nibh pellentesque et molestie mauris adipiscing.
Curabitur elementum rutrum augue vitae tempus. Donec tincidunt ipsum ac arcu</div>
</li>
<li>
<ul class="meta">
<li class="image"><img src="http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?s=48" alt="Author's name" /></li>
<li class="author"><a href="#">Author's name</a></li>
<li class="date">posted on September 23rd, 2009</li>
</ul>
<div class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse at enim augue, et luctus odio. Duis porttitor orci id arcu consequat varius.
Pellentesque tempus augue sed purus facilisis vitae feugiat sem convallis. Maecenas a dolor velit.
Ut tempus elit et nibh pellentesque et molestie mauris adipiscing.
Curabitur elementum rutrum augue vitae tempus. Donec tincidunt ipsum ac arcu</div>
</li>
<li>
<ul class="meta">
<li class="image"><img src="http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?s=48" alt="Author's name" /></li>
<li class="author"><a href="#">Author's name</a></li>
<li class="date">posted on September 23rd, 2009</li>
</ul>
<div class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse at enim augue, et luctus odio. Duis porttitor orci id arcu consequat varius.
Pellentesque tempus augue sed purus facilisis vitae feugiat sem convallis. Maecenas a dolor velit.
Ut tempus elit et nibh pellentesque et molestie mauris adipiscing.
Curabitur elementum rutrum augue vitae tempus. Donec tincidunt ipsum ac arcu</div>
</li>
</ol>
<!-- COPY END HERE -->
</div>
</div>