Blogger テンプレート、Smart の導入とサムネイル表示を調整

  • B!

こんにちは

成長がリセットされる生き方をしている私です。

 

テンプレートSmart を導入しデザインを一新。

しかし、サムネイルサイズが正方形なため、映画ポスターと相性が悪い。

というわけで自分で書換をせにゃならんわけですが、コレが辛い。

なにが辛いって、昔のブログの時だとか、WordPressを触ってときとか、けっこう勉強したのになに一つ覚えちゃいない。

まーた今回も一つ一つググって、書き直して失敗しての繰り返しですよ。

で、そこそこ妥協点を見つけたのでメモ、備忘録とは、忘れないためではなく、見返す為にあるのだ。

 

     /* サムネイル */
    .article-thumbnail {
      width: 50%;
      margin-right: 15px;
      overflow: hidden;
      text-align: center;

    }

    .article-thumbnail img {
      width: auto;
      height: 99%;
      border: solid 1px #ddd;
      object-fit: cover;
    }

正直原理はわかっていないが、img 部分の幅を自動にすると、正方形ではなくもとのサイズ比で表示してくれる。

しかしこのままだと、空間が余って左に寄ってしまうので、センターの命令を追加して、中央に収まるようにした。

本当はサムネイル表示域も調節できたら良かったけど、もう考えるのを辞めたい。

その内するかも。まあいいか。


この記事をシェアする
  • B!
次の投稿 前の投稿
コメントなし
コメントする
comment url