momoiro学園のスレッドリンク左部分のサムネイル画像のアスペクト比(縦横比)はデフォルトでは80px×80pxです。
アップロードした画像が正方形なら問題ないのですが、縦長い画像や横長の画像の場合、潰れた感じで正方形に表示されます。
※左画像参照
下の画像は縦サイズを調整してアスペクト比を正した表示にしたものです。
クリックすると拡大します。
しかし、画像サイズが揃っていない場合はダサいデザインになります。ユーザビリティも悪い。
CSS(スタイルシート)を見てみるとデフォルトでは
.thread-inframe .img-frame{
width:80px !important;
height:80px !important;
}
このように指定されているのでCSSを上書きする形で再指定します。
上書きするCSSは以下をコピペしてご利用ください。
下の画像は上で紹介した方法に少し手を加えたものです。
アスペクト比を整えて表示されるサムネイル画像のサイズも揃ってる今主流の美しく使いやすいデザインです。
コピーしたCSSは管理ページの「CSS編集」にペーストして使います。
本掲示板ではトップページにしか使わないので「トップページ編集」に<style>と</style>を用いて記述しています。