Skip to content

Instantly share code, notes, and snippets.

@icodeforlove
Created June 21, 2012 05:54
Show Gist options
  • Save icodeforlove/2964105 to your computer and use it in GitHub Desktop.
Save icodeforlove/2964105 to your computer and use it in GitHub Desktop.
Untitled
body {
background-color: #eeeeee;
}
#posts {
margin: 0px;
padding: 0px;
list-style: none;
}
#posts .post {
width: 201px;
margin: 12px;
padding: 12px;
float: left;
background-color: #fafafa;
-webkit-box-shadow: 0px 0px 15px 0px #ccc;
}
#posts .likes {
background-image: url(http://d36xtkk24g8jdx.cloudfront.net/bluebar/8ae247e/images/p-page/heartShape.png);
background-size: 14px;
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left: 18px;
font: 13px "arial";
font-weight: bold;
color: #444;
}
#posts .comments {
background-image: url(http://d36xtkk24g8jdx.cloudfront.net/bluebar/8ae247e/images/p-page/speechBubble.png);
background-size: 12px;
background-repeat: no-repeat;
background-position: 2px 3px;
padding-left: 18px;
margin-left: 10px;
font: 13px "arial";
font-weight: bold;
color: #444;
}
#posts .timestamp, #posts .filter {
margin-top: 10px;
font: 13px "arial";
color: #9E1C4A;
}
#posts img {
width: 201px;
}
<ul id="posts">
<li class="post">
<img src="http://distilleryimage1.s3.amazonaws.com/a878b6feb66711e1b00112313800c5e4_6.jpg" />
<div><span class="likes">12<span> <span class="comments">12<span></div>
<div><span class="timestamp">5d ago</span> / <span class="filter">Something</span></div>
</li>
<li class="post">
<img src="http://distilleryimage1.s3.amazonaws.com/a878b6feb66711e1b00112313800c5e4_6.jpg" />
<div><span class="likes">12<span> <span class="comments">12<span></div>
<div><span class="timestamp">5d ago</span> / <span class="filter">Something</span></div>
</li>
<li class="post">
<img src="http://distilleryimage1.s3.amazonaws.com/a878b6feb66711e1b00112313800c5e4_6.jpg" />
<div><span class="likes">12<span> <span class="comments">12<span></div>
<div><span class="timestamp">5d ago</span> / <span class="filter">Something</span></div>
</li>
<li class="post">
<img src="http://distilleryimage1.s3.amazonaws.com/a878b6feb66711e1b00112313800c5e4_6.jpg" />
<div><span class="likes">12<span> <span class="comments">12<span></div>
<div><span class="timestamp">5d ago</span> / <span class="filter">Something</span></div>
</li>
</ul>
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment