我的页脚不会垂直对齐答案

【问题标题】：My footer won't align vertically我的页脚不会垂直对齐
【发布时间】：2017-05-10 18:45:54
【问题描述】：

我试图让我的 li 元素保持在同一行，但它们不会（它们水平对齐但仅此而已）

代码如下：

<footer>
    <div class="container">
      <div id="coisas"
      class="col-6">
        <div class="row">
          <ul class="col-6">
            <li class="col-1"><img src="icon-behance.png"></li>
            <li class="col-1"><img src="icon-behance.png"></li>
            <li class="col-1"><img src="icon-behance.png"></li>
          </ul>
        </div>
      <div id="nothing"
      class="col-6">
      </div>
    </div>
  </footer>

这是 CSS：

#coisas {
  float: right;
  bottom: 0;
  position: absolute;
  size: 50%;
  left: 0;
  padding-left: 5%;
  padding-right: 5%;
}
#nothing {
  size: 50%;
  right: 0;
}

【问题讨论】：

标签： html css bootstrap-4

【解决方案1】：

要达到预期效果，请使用以下选项

#coisas ul li{
  display:inline;
}

Codepen-https://codepen.io/nagasai/pen/vmdYNg

【讨论】：

【解决方案2】：

我不确定您要做什么，但 Bootstrap col 应该始终在 row 内..

<footer>
    <div class="container">
        <div class="row">
            <div id="coisas" class="col-6">
                <ul class="row list-unstyled">
                    <li class="col-1"><img src="//placehold.it/40"></li>
                    <li class="col-1"><img src="//placehold.it/40"></li>
                    <li class="col-1"><img src="//placehold.it/40"></li>
                </ul>
                <div id="nothing" class="col-6">
                </div>
            </div>
        </div>
    </div>
</footer>

http://codeply.com/go/ArVyBK4VU5

【讨论】：

【解决方案3】：

试过你的问题，现在解决了，你可以在这里查看！

#coisas ul li{
  display:inline;
}

Demo

【讨论】：

【解决方案4】：

float 属性指定一个盒子（一个元素）是否应该浮动。如果您将li 元素浮动到左侧，它们将排列在同一行中。因此，要将它们放在一行中，您可以使用：

#coisas ul li{
list-style-type:none;
float:left;
}

list-style-type:none; 属性仅用于删除列表项的项目符号。

您可以在此处了解有关 css float 属性的更多信息：https://www.w3schools.com/cssref/pr_class_float.asp

【讨论】：

来自审核队列：我可以请求您为您的答案添加更多上下文。仅代码的答案很难理解。如果您可以在帖子中添加更多信息，这将对提问者和未来的读者都有帮助。
@RBT 上下文已添加。