アイコンWeb制作実験

HTML/CSS/jQuery/Fabric.js
を試した様子と結果です.

「floatで段組:可変幅(%指定)+可変幅(%指定)」の実験

PCでご覧の方はウインドウ幅を広げたり狭めたりしてみてください。

基本形

boxAの幅を30%、boxBの幅を70%に指定しました。

boxA

A A A A A A A A A A A A A A A A A A A A A A A A A A A A A A

boxB

B B B B B B B B B B B B B B B B B B B B B B B B B B B B B B

最大幅と最小幅を指定

boxAのみ、最大幅(max-width)200px、最小幅(min-width)150pxを指定しました。

背景の縦線は100px間隔で、BoxAのborder(赤線)の左外側が基準です。

boxA

A A A A A A A A A A A A A A A A A A A A A A A A A A A A A A

boxB

B B B B B B B B B B B B B B B B B B B B B B B B B B B B B B