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で3カラム作成方法のまとめ
• Twenty Twelveで記事の文字の大きさを変更する
• 【Twenty Twelve】2カラムのサイドバー2カラム
• 【Twenty Twelve】3カラムのCSS（中央に記事、両サイドにサイドバー）パターン２
• 【Twenty Twelve】3カラムのCSS3方法２（中央に記事、両サイドにサイドバー）
• 【Twenty Twelve】3カラムのCSS3方法１（中央に記事、両サイドにサイドバー）
• 【Twenty Twelve】3カラムのCSS（左に記事、右にサイドバー2つ）
• 【Twenty Twelve】3カラムのCSS（中央に記事、両サイドにサイドバー）パターン１