Twenty Twelveで、サイドバーの幅のサイズを変更するCSS

環境によりますが、パソコンの場合「@media screen and (min-width: 600px)」の.widget-areaのwidthの値を変更すると表示幅が変ります。

@media screen and (min-width: 600px) {
  .widget-area {
    float: right;
    width: 26.041666667%; //幅の設定
  }
}

250px ÷ 960px × 100% = 26.041666667

IE対策

style.cssファイルに書く場合、「.ie8 .widget-area」を追加してwidthの値を変更すると表示される幅が変更されます。ただし、「@media screen and () 」の外に書きます。

.ie8 .widget-area {
  float: right;
  width: 26.041666667%; //幅の設定
}

/css/ie.cssファイルで表示を変える場合、.widget-areaのwidthの値を変更することで、ブラウザに表示される幅を変更できます。

.widget-area {
  float: right;
  width: 26.041666667%; //幅の設定
}

Twenty Twelveで、サイドバーの幅のサイズを変更するCSS」への1件のフィードバック

  1. ピンバック: 今さら聞けない、WordPressのテーマ「Twenty Twelve」のサイドバーとメインコンテンツの幅の比率を変えたい〜《追記》IE対策は別途必要 | ローカルブロガーのメモ帳

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です