css,カラム落ち防止

「width崩れ、カラム落ちにはこれ」まるでチート！【CSS3】box-sizingが実はすごい子
2014/07/17

taneppa
http://taneppa.net/box-sizing/





******************************************************************************

1

<style>

2	.contBlock {

3	width:500px;

4	margin:0 auto;

5	background:#fff;

6	border:2px solid #ccc;

7

}

8	.contBlock .dreamBox01 {

9	width:300px;

10	height:80px;

11	padding:10px;

12	margin:20px auto;

13	background:#8EF9FF;

14	border:4px solid #ccc;

15

}

16	.contBlock .dreamBox02 {

17	box-sizing:border-box;

18	-webkit-box-sizing:border-box;

19	-moz-box-sizing:border-box;

20	-ms-box-sizing:border-box;

21	-o-box-sizing:border-box;

22	width:300px;

23	height:80px;

24	padding:10px;

25	margin:20px auto;

26	background:#A4FFA6;

27	border:4px solid #ccc;

28

}

29

</style>

30	<div class="contBlock">

31	<div class="dreamBox01"></div>

32	<div class="dreamBox02"></div>

33

</div>

******************************************************************************