0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

片方のボックスの横幅を固定して、もう片方は自由に。

0
Last updated at Posted at 2019-04-10

無題.png

これを用意した、
box2のwidthは200px、box3のwidthは50%という指定である。
ここからbox2,3の横幅の合計がbox1と同じにするには、

手順

step1
box3に
・float: none;
・width: auto;  を指定。
すると、フローティングボックスではなくなり、box3がbox2の後ろに回り込む。widthは、100%になる。
無題.png
step2
box3に
・margin-left: 200px;  を指定。

すると、完成!
無題.png

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?