css - 如何在一行中显示div元素

Question

我的 div 元素有问题，我无法在一行中显示它们:

<div>
 <table>
  <tr>
   <td>hellow world</td>
  </tr>
 </table>
 <ul>
  <li>hi world</li>
 </ul>
</div>

在 ul 上方显示的表格，我希望两个元素显示在一行中并排显示。 我尝试使用:

div
{
   display:inline;
}

或:

div
{
   display:block;
}

但是没有用。任何人都可以帮助我吗？？

Answer 1

如果你想并排显示 table 和 ul，那是你应该定位的两个元素，而不是它们恰好所在的容器。

如果他们一样高，简单写

table {float:left; margin-right:40px}

会成功的。 (您将需要边距，因为列表也使用边距来显示元素符号，如果您不提供边距，元素符号最终会在表格内。)

参见 fiddle

如果表格比较高，之后还需要清除 float ，否则后面的内容也可能会在表格右侧结束:

div::after {content:''; display:block; clear:both}

参见 updated fiddle