Question

我正在建立一个网站。在它的页脚我有一个标志。它位于正确的位置，但当我使用移动设备访问该网站时，徽标位置错误。

以前工作过，现在却没有。我无法弄清楚为什么。这是我的代码：

HTML

<footer class="page-foot bg-dark">
    <section class="footer-content">
      <div class="container">
        <div class="rd-navbar-brand pull-lg-left"><a href="index.html" 
class="brand-name">
<img src="logo1.png" style="width: 35%" width="120px">               
</div>
        <div style="text-align: left;">
        <ul class="list-inline list-inline-mod-1 visible-md-inline-block 
visible-lg-inline-block pull-sm-right">
          <li><a href="meadows.html">Rolling Meadows</a></li>
          <li><a href="heights.html">Attorney Arlington Heights</a></li>
          <li><a href="palatine.html">Lawyer Palatine </a></li>
          <li><a href="mount.html">Attorney Mount Prospect</a></li>
          <li><a href="des.html">Lawyer Des Plaines</a></li>
          <li><a href="scha.html">Attorney Schaumburg</a></li>
          <li><a href="hoff.html">Hoffman Estates</a></li>
          <li><a href="elk.html">Attorney Elk Grove Village</a></li>
        </ul>
        </div>
      </div>
    </section>
  </footer>

CSS 它指定了徽标的位置

.page-foot .rd-navbar-brand {
   margin-bottom: -4%;
   margin-left: -18%;
}

我是CSS和HTML的新用户，你能解释一下为什么会这样吗？

Answer 1

.page-foot .rd-navbar-brand上有负利润 - 取消它们应该回到正确的位置！添加了一些底部填充，因此徽标在顶部/底部具有相同的填充。

@media (max-width: 767px){
  .page-foot .rd-navbar-brand{
    margin: 0 0 30px;
  }
}

HTML徽标无响应

1 个答案: