【wordpress】サイドバーの幅を固定したままレスポンシブcss

woredpressで作ったレスポンシブ(スマホ対応)サイトで、メインコンテンツの幅は変わるけどサイドバーを任意の幅で固定しておきたい言う場合には下記のcssコードを追加するとOKです。

.main{
max-width: -webkit-calc(100% - 300px);
max-width: calc(100% - 300px);
}
.sidebar{
width: 300px;
}

上記のコードで、メインコンテンツの幅の最大値が100%から300pxを引いたものとなり、サイドバーを300pxに固定となります。

サイドバーに固定幅のAdsense広告を置いておきたいときなどに便利ですね!

参考までに♪

おすすめ関連記事

\ SHARE /