页脚的样式和位置，包含 3 列答案

【问题标题】：Style and position on footer whit 3 colums页脚的样式和位置，包含 3 列
【发布时间】：2020-10-21 20:22:32
【问题描述】：

我的页脚包含 3 列。问题是当我尝试在 css 中设置它们的样式时它们不会移动。我已经尝试过 flexbox 属性，但它不起作用，我想不出其他任何东西。在下面的图片中，您可以看到页脚太小，并且没有居中对齐。

HTML：

<div class=" col-lg-4 col-md-6 footer ">
    <div class="box-1">
      <h2>CONTACT</h2>
      <p> <span class="phone">+902385203</span> </p>
      <p> <span class="phone">+12412412</span>  </p>
      <p> <span class="phone">124312412</span> </p><br>
      <p></p>
      <a class="phone" href="#">Myceliumtour@gmail.com</a>
      <br>
      <p></p>


      <p> <span class="phone">Balan, 535200</span> </p>
      <p> <span class="phone">Harghita, Romania</span>  </p><br>

      <div class="links">
        <i id="fb" class="fab fa-facebook"></i>
        <i id="yt"class="fab fa-youtube"></i>

      </div>



    </div>
    <div class="box-2">
      <a href="#"> <img src="logo1.png" alt="footerlogo"> </a>

    </div>
    <br>
    <div class="box-3">
        <h2>CONTENTS</h2><br>
        <p> <span>ABOUT</span> </p>
        <p> <span>STORIES</span> </p>
        <p> <span>CONTACT</span> </p><br>



    </div>
</div>
<hr>

CSS：

.footer{
  display: flex;
  justify-content: space-between;
  justify-content: space-around;
  position: relative;
  align-content: flex-start;
  
  }

图片：

【问题讨论】：

标签： html css twitter-bootstrap-3

【解决方案1】：

你并不是在说你想要达到的目标......

是否要将页脚内容放在行的中间？

如果是这种情况，请删除 css 并将 class="d-flex justify-content-center" 添加到您的页脚 div 中。就是这样。

【讨论】：

【解决方案2】：

请从这张图片中查看你的班级和我的班级还有我的 flex 的 css

【讨论】：

【解决方案3】：

在你的类里面使用这个属性，你的问题就会得到解决。

-ms-flex: 0 0 100%; 弹性：0 0 100%；最大宽度：100%

【讨论】：

【解决方案4】：

问题可能是因为您为页脚提供的类。为什么会有 col-md-6 和 col-lg-4 ？试着把它取下来看看它是否有效，因为通过查看图像，它看起来像是使用了 1/3 的屏幕，这是使用 col-lg-4 所预期的。

一个提示，给页脚一个background-color，这样你就可以看到它是否占屏幕的100% width。

【讨论】：