Home >Web Front-end >HTML Tutorial >After using float in CSS, if the browser interface is reduced, the box will float down. _html/css_WEB-ITnose
After using float in CSS, if the browser interface is reduced, the box will float down. _html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:21:141470browse
CSS interface HTML float positioning
Let me give a simple example:<head><style type="text/css"> /*自定义盒子的大小*/ div{ border:#999 solid 1px; height:200px; width:300px;} #div_1{background-color:#0FF; float：left; } #div_2{background-color:#F0F; float:left; } #div_3{background-color:#FF0; } </style></head><body> <div id="div_1">第一个盒子</div> <div id="div_2">第二个盒子</div> <div id="div_3">第三个盒子</div></body> If the browser interface is reduced, the second and third boxes will float to the first box The following is gone, how to solve it?
Reply to the discussion (solution)
When maximizing the interface at the beginning, it looks like this: 口口口
After shrinking the browser interface, it becomes: 口
.
<body> <html style="min-width:906px;overflow-x:auto;"> <div id="div_1">第一个盒子</div> <div id="div_2">第二个盒子</div> <div id="div_3">第三个盒子</div> </html></body>Just use a table to dice the two modules. . .
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：Write #C9D9F2 in css, and the color will be displayed when the mouse is placed, which is very intuitive. Does anyone know what plugin this is? ? _html/css_WEB-ITnoseNext article：Write #C9D9F2 in css, and the color will be displayed when the mouse is placed, which is very intuitive. Does anyone know what plugin this is? ? _html/css_WEB-ITnose