CSS：位置：絶対的な権利水平スクロールせずに

Question

私はここに、このレイアウトのデモを持っている：http://jsfiddle.net/LwRva/

私が達成しようとしている何がほとんどのユーザーのために680px幅のあるレイアウトですが、唯一480PX - なしより小さい解像度を使用する場合は水平スクロールバーを使用します。 （実際にはJSFiddleで680pxが1180px、480pxが980pxであることを想像してください）

本質的に3列のdivレイアウトです。ページが表示されない場合は左右の列は表示されません。

私はすでに左の列が欲しいと思っていますが、ページに収まらない場合は水平のスクロールバーを変更しません。私の問題は右の列にあります。負のマージン - 右は同じようには機能しないという事実のために。

アイデア？

Answer 1

@RoToRaはメディアに適しています。

@media screen and (max-width: 580px) {.featured-box-left {display:none} } 
@media screen and (max-width: 480px) { 
.featured-box-left,.featured-box-right{display:none;} 
} 

画面の幅は580pxです

が、その後 .featured-box-leftを隠す：あなたのレイアウトのための可能なCSSは次のようである可能性があります。画面が480ピクセル以下の場合、左右両方を非表示にします。

デモ：http://jsfiddle.net/LwRva/6/

は、一般的にあなたが達成TOUしようとしているものを呼び出しResponsive Web Designです。あなたは情報を見つけることができる偉大な記事を持っています：http://www.alistapart.com/articles/responsive-web-design/