<body>
<div class="main-div">
<table id="gameboard-table"></table>
</div>
<div class="main-div">
Waiting for X players to join
<div> Player 1 - </div>
<div> Player 2 - </div>
<div> Player 3 - </div>
<div> Player 4 - </div>
</div>
</body>
第一个 div 有一个动态创建的表，第二个是静态的。
我尝试过使用
.main-div {
float: left;
}
但 div 仍然是一个在另一个之下。
当然我没有忘记在html中包含CSS文件:)
如何解决？
谢谢！！！
您需要设置它们的宽度，否则它们只会填充到 100%。
.main-div {
float: left;
width: 50%;
}
你的 float-left 应该位于 main-div 的子 div 上：
.main-div div {
float: left;
}
看看这个 JSFiddle：
请注意，按照您现在的 HTML 编写方式，“等待”文本不会出现在它们上方。您需要将其包装在一个单独的元素中，以便它出现在 div 的上方（我假设这就是您想要的效果）。