最近、縦写真を撮ることが増えました。 そこで課題となっていたのが、ブログで横写真と縦写真を複数用いた場合の、縦写真の存在感。 そんな中、id:RyoAnnaさんがこんな記事を書かれており、自分のブログでも少しレイアウトを考えてみました。 www.ryoanna.com はてなブログにおける縦写真のサイズを調整する。 ※PCのみ調整しました サイズと位置を考える 調整したのは2点。 1.縦写真の幅を70%に設定 適当に指定してみたら良い塩梅でした。 これで読者のディスプレイ環境に関わらず、記事の横幅に対して70%の横幅で表示されます。 ちなみにブログの横幅よりwidthが大きいため、横写真は設定触らず。 これで横幅の比は縦写真:横写真=7:10となりました。 2.中央揃え 幅80%の設定をすると、基本的に左づめのブログ記事では写真が左に寄ってしまう。 ちょっとかっこ悪いので、縦写真だけは中央