divがブラウザ上で正しく動かないサイズ変更

Question

私は自分のサイト用のショッピングカートを設定しようとしていますが、ブラウザのサイズを変更したときにcssを正しく使用して3つの列をフォーマットする知識が不足しています。

CSSは、もともと持っていた次：

.threeFrames .leftStyle {float: left; position: relative; width: 20%;} 
.threeFrames .centerStyle {float: left; position: relative; max-width: 60%;} 
.threeFrames .rightStyle {float: left; position: relative; width: 20%;} 

しかし、これは私が望んでいた効果を持っていませんでした。私は両端の列を固定してwidth 240pxに設定したいと思いますが、ブラウザをサイズ変更するときに右端の列が他の列の下にくるのに対して、中央の列は縮小したいだけです。

Answer 1

.rightStyle {float:right;}を作成して中央の列をスタイルしないと、可能であれば自動的に折り返されます。

Answer 2

右の列が他の列の下にある場合は、その内容がコンテナに収まらないことを意味します。その原因は、mixing of percentages and fixed widthsです。