Бес попутал
by pharma_nsk
HTML
<body>
<div class="container">
<h1><a href="#">Блог: техническое</a></h1>
<header>
<span><img src="http://magon.net.ru/wp-content/themes/imagine/images/date-ico.png"></span><span>Опубликовано:</span><span class="data"> 22/12/2011</span><span><img src="http://magon.net.ru/wp-content/themes/imagine/images/cat-ico.png"></span><span> Категория: </span><span><a href="#" class="category">Блог</a></span><span class="comment"><img src="http://magon.net.ru/wp-content/themes/imagine/images/comment-ico-w.png"><a href="#">Оставить комментарий</a></span><br>
<span class="teg">blog</span> <span class="teg">lytdybr</span> <span class="teg">thoughts</span>
</header>
<article>
<img src="http://magon.net.ru/wp-content/uploads/robotstxt-300x244.jpg">Друзья, нужна помощь!<br>
<br>Бес попутал и я пару месяцев назад решил «оптимизировать» файл robot.txt на сайте. Дооптимизировался!<br><br><a href="#">Читать дальше</a></article>
<div class="footer"></div>
</div>
</body>CSS
@import 'https://fonts.googleapis.com/css?family=Tenor+Sans';
.container {width:90%; margin:20px auto; background-color:white; box-shadow: 0px 0px 17px 0px rgba(71,71,71,0.4); padding:5px 20px; }
h1 a {color:black; text-decoration:none;font-family: 'Tenor Sans', sans-serif; font-size:24px; line-height:26px;}
header span, header a {display:inline-block; margin-right:5px; color:#707070; text-decoration:none; font-size:11px; height:11px; font-family:sans-serif;}
header .category, .data, .comment {font-weight:bold; font-size:12px; }
header img {display:inline-block; line-height:14px; vertical-align:top;}
.comment {float:right;}
.comment img {margin-right:5px;}
.teg {display:inline-block; color:white;font-weight:bold; height:15px; background-color: #707070; padding:2px 5px;}
article img {float:left;}
article {font-family:sans-serif;font-size:13px; color:#5E5E5E; margin-top:20px;}
article a {text-decoration:none; font-style:italic;font-weight:bold;color:#5B79B0;}
.footer {height:1px; clear:both;}