这是我的 html 模板的结构，在大屏幕(电脑显示器)上显示我的网页时效果很好，但在小屏幕(手机屏幕)上显示时效果不佳，最右边的列显示在页面底部而不是在右侧，我需要的是不是将列移动到页面底部，而是可以让页面水平滚动吗？最右边的 div 永远不会被推到底部？
<div>
<div style="float:left;">
</div>
<div style="float:left;">
<pre> </pre>
<!--Just to create space-->
</div>
<div style="float:left;">
</div>
</div>
<div style="clear:left"></div>
最佳答案
好吧，当您使用 float 而不设置父元素的宽度时就会发生这种情况。 您可以设置父元素的最小宽度(或者宽度应该可以)或使用 % 中的 div 大小，和/或使用 display: table;，而不是 float。 这是一个例子:http://jsfiddle.net/c995v/ `
<body>
<div id="parent">
<div style="float:left;">first float left</div>
<div style="float:left;"> <pre> second float left </pre>
<!--Just to create space-->
</div>
<div style="float:left;">third float left</div>
</div>
<div style="clear:left"></div>
</body>
关于html - div 最右边的列在小屏幕上向下推，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24481347/