【ブログデザインカスタムのメモ記事です】このブログはSimple Grayというテーマをカスタムして使っていますが、、、iTunes商品紹介のリンクだけがデザイン的に見にくかったので、、、少しだけ変更しました。
元デザイン(画像です)
CSS変更後のデザイン(画像です)
追加したCSS
.itunes-embed {
margin: 1em 0;
border-image: initial;
font-size: 90%;
display: block;
*zoom: 1;
}
.itunes-embed:after {
display: block;
visibility: hidden;
font-size: 0;
height: 0;
clear: both;
content: ".";
}
.itunes-embed .itunes-embed-image {
float: left;
margin-right: 15px;
max-width: 100px;
}
.itunes-embed .itunes-embed-title {
margin-top: 0;
font-weight: bold;
margin: 0 0 .3em 0;
}
.itunes-embed p {
text-indent: 0;
}
.itunes-embed ul {
list-style: none;
margin: 0;
padding: 0;
}
.itunes-embed ul li {
line-height: 1.5;
}
.itunes-embed .itunes-embed-preview {
margin: 10px 0;
}
.itunes-embed.itunes-kind-software .itunes-embed-image {
-webkit-border-top-right-radius: 15px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
-webkit-border-top-left-radius: 0;
-moz-border-radius-topright: 15px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-topleft: 0;
border-top-right-radius: 15px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
他のはてな公式のテーマとCSSを入れ替えただけです。しばらくこれで使ってみよう。