Skip to content

Instantly share code, notes, and snippets.

@princed

princed/dabblet.css

Forked from tyv/dabblet.css
Created July 18, 2012 20:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save princed/3138678 to your computer and use it in GitHub Desktop.
Save princed/3138678 to your computer and use it in GitHub Desktop.
Download ZIP
Страница карточек
Raw
dabblet.css
/*
* Страница карточек
* http://clck.ru/d/UABmzLuo14p-h
*/
.card
{
border: 1px solid #ccc;
margin-bottom: 5px;
}
.photo
{
display: inline-block;
border: 1px solid #ccc;
height: 64px;
width: 64px;
padding: 0;
margin: 5px;
vertical-align: middle;
text-align: center;
overflow: hidden;
}
.photo img
{
display: inline-block;
vertical-align: middle;
}
.photo i
{
display: inline-block;
height: 100%;
vertical-align: middle;
}
h2
{
margin-top: 0.07em;
display: inline-block;
vertical-align: top;
font-variant: small-caps;
font-size: 20px
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328b_cbbc7166_XS.jpg" alt="photo"><i class="photo__i"></i>
</span>
<h2 class="card__title">Иванова Надежда Соломоновна</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328c_3fd835ed_XS.jpg" alt="photo"><i></i>
</span>
<h2>Константинопольский-Мовсесян Василий Заурович</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6209/50952485.2/0_b328d_5d26f2a_XS.jpg" alt="photo"><i></i>
</span>
<h2>Ли Си Цын</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328c_3fd835ed_XS.jpg" alt="photo"><i></i>
</span>
<h2>Аввакуумов Варлаам Харлампович</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328b_cbbc7166_XS.jpg" alt="photo"><i></i>
</span>
<h2>Зальц Ираида Арчибальдовна</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328c_3fd835ed_XS.jpg" alt="photo"><i></i>
</span>
<h2>Наум Федор Патрикеевич</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6209/50952485.2/0_b328d_5d26f2a_XS.jpg" alt="photo"><i></i>
</span>
<h2>Апполинарий Кондратьевич</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328b_cbbc7166_XS.jpg" alt="photo"><i></i>
</span>
<h2>Марина Викторовна</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328c_3fd835ed_XS.jpg" alt="photo"><i></i>
</span>
<h2>Павленко Павел Павлович</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6209/50952485.2/0_b328d_5d26f2a_XS.jpg" alt="photo"><i></i>
</span>
<h2>Петров Никифор</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328b_cbbc7166_XS.jpg" alt="photo"><i></i>
</span>
<h2>Какая-то Валентина Михайловна</h2>
</div>
<div class="card">
<span class="photo">
<img src="http://img-fotki.yandex.ru/get/6300/50952485.2/0_b328c_3fd835ed_XS.jpg" alt="photo"><i></i>
</span>
<h2>Делчев Яков Спиридонович</h2>
</div>
Raw
settings.json
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment