おきがるみがる

お気軽&身軽に趣味や資産運用(インデックス投資)を楽しむ雑記ブログです。

【Sentence】タブレット表示時のサイドバーが2列で表示されるように仕様を戻しました

www.okigaru-migaru.net

たびたびSentenceの仕様変更してすみません。

以前に、タブレット表示した際のサイドバーが2列になるとガタガタになって見にくいので1列表示になるよう変更しましたが、今日アップデートして2列に戻しました。

理由は単純明快で、ガタガタにならないよう整列する方法がわかったからです。

 #box2-inner .hatena-module:nth-child(2n+1) {clear: both;}

このコードをSentenceのCSS、@media (min-width: 768px) {}の中に入れました。

サイドバーが複数列でも綺麗に整列しているブログのソースを覗き見して借用しちゃいました。ずるくてすみません。

「2n+1」のnの前が列の数です。Sentenceの場合は2列で表示した方が横幅がちょうどいいので。3列にする場合は「3n+1」という感じですね。

ぶっちゃけますと、このコードで改良可能ということは1列へ仕様変更した記事を投稿した直後にはわかっていました。

ただ、何度も仕様変更するのはあまりよくないなぁと思い1列のままでいくかと思っていました。

しかし、記事下のダブルレクタングルの表示がおかしいことに気付きまして、どうやらSentenceのテーマCSSに不具合があったようです。

結局どこに不具合があったのかはわからなかったのですが、バックアップから2列表示の仕様に戻し、そのついでに今回の綺麗に整列するコードを追加したという感じです。

何はともあれ、1番気になっていた部分が解消されたのでSentenceはこれにて完成ということでいいかと思います。

今後は要望があれば改良していこうと思います。