記事リストでサムネイル無を表示するCSS

目的

muragonのカスタマイズ。

記事リストでサムネイル無しの時、「サムネイル無し画像」を表示する。
また、投稿記事は、先頭から最大200文字表示するが、3行のみ表示させ、記事リストの高さを揃える。
この時、Chrome、Safariのみ三点リーダ表示する。

CSS

/* サムネイル無し画像を背景画像として表示 */
.unit-contents-inner {
position : relative;
padding-left : 200px;
background : url(https://public.muragon.com/krtnrpoj/wcpivdk7.gif) no-repeat;
}

/* サムネイルを左上寄せで配置し、背景画像に重ねる */
.unit-contents .entry-thumbnail {
position : absolute;
top : 0;
left : 0;
width : 190px; /* 最大192×192px */
height : 190px;
margin-left : 0;
}

/* 投稿記事を3行表示 */
.unit-contents .entry-excerpt {
display : block;
display : -webkit-box;
-webkit-line-clamp : 3;
-webkit-box-orient : vertical;
height : 4.8em;
overflow : hidden;
}