两个div并排 – stream体显示
我想并排放置两个div，并使用下面的CSS。
#left { float: left; width: 65%; overflow: hidden; } #right { overflow: hidden; } HTML很简单，在一个包装div中有两个左右div。
<div id="wrapper"> <div id="left">Left side div</div> <div id="right">Right side div</div> </div>
我已经尝试了很多次在Stackoverflow和其他网站上search更好的方法，但无法find确切的帮助。
所以，代码乍一看工作正常。 问题是这样的，左边的div自动获得填充/边距，因为我增加了（％）的宽度。 所以，在65％的宽度，左边的div有一些填充或边距，并没有完全与正确的divalignment，我试图填充/保证金0，但没有运气。 其次，如果我放大页面，右边的div在左边div下滑动，就像不stream畅的显示。
注意：对不起，我查了很多，这个问题已经被问了很多次了，但是那些回答对我来说没有帮助，我已经解释了我的情况是什么问题。
我希望有一个解决办法。
谢谢。
编辑：对不起，我的HTML问题，有两个“框”divs在左右两侧，他们填充％，所以左侧显示更多的宽度更多的填充。 对不起，上面的CSS工作完美，其stream体显示和固定，对不起，问错误的问题….
小提琴
试试像这样的系统：
HTML：
<section class="container"> <div class="one"></div> <div class="two"></div> </section>
CSS：
.container { width: 80%; height: 200px; background: aqua; margin: auto; padding: 10px; } .one { width: 15%; height: 200px; background: red; float: left; } .two { margin-left: 15%; height: 200px; background: black; }
你只需要浮动一个div如果你使用另一边的margin-left等于第一个div的宽度。 这将工作，不pipe是什么缩放，并不会有子像素的问题。
使用flexbox这很容易：
#wrapper { display: flex; } #left { flex: 0 0 65%; } #right { flex: 1; }
使用这个CSS为我当前的网站。 它工作完美！
#sides{ margin:0; } #left{ float:left; width:75%; overflow:hidden; } #right{ float:left; width:25%; overflow:hidden; }
