html - 为什么我的手风琴有间隙并且即使我放置边距和填充 0px 也是间隔的

Question

嗨，我用 Bootstrap 为我的教堂制作了一个网站，并将其制作成 Wordpress。我想知道当我分离所有 Wordpress 文件时，为什么我的手风琴是这样的。

蓝条应该是接触的，并且它不应该那么厚，因为它在手风琴的标题下方和上方留下空间。

假设看起来像这样：

这是我在手风琴上的所有CSS：

 .accback {
     margin-top:-20px;

     }

 .accordion-inner ul li {
     list-style:none;
     line-height:35px;
     color:black;


     }

 .accordion-toggle {
     color:white;
     padding:0px;
     margin:0px;
     border:0px;
 }
 .accordion-toggle a {
     color:white;
     padding:0px;
     margin:0px;
     border:0px;
 }

 .accordion-heading{
      padding:0px;
     margin:0px;
     border:0px;
     }

     .accordion-group{
         padding:0px;
     border:0px; 

         }
  .accordion {
     margin:auto;
     padding:50px 20px 40px 20px;
     max-width:500px;
     border:0px;
 }

这是我的手风琴：

 <div class="hidden-desktop container">
    <div class="accback">
   <div class="accordion text-center" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading btn-primary">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">Events<div class="pull-left"><i class="icon-chevron-down icon-white"></i></div>
      </a>
    </div>
    <div id="collapseOne" class="accordion-body collapse">
      <div class="accordion-inner">
       <ul>
      <li>Facebook</li>
      <li>Twitter</li>
      <li>Instagram</li>
      <li>LinkIn</li>
      </ul>
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading btn-primary">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo"><div class="icon-chevron-down icon-white pull-left"></div>
        Schedule
      </a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
        <ul>
      <li>(818)111-1111</li>
        <li>(818)222-2222</li>
         <li>(818)333-3333</li>
          <li>(818)444-4444</li>
      </ul>
      </div>
    </div>
  </div>
   <div class="accordion-group">
    <div class="accordion-heading btn-primary">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree"><div class="icon-chevron-down icon-white pull-left"></div>
       Worship Night
      </a>
    </div>
    <div id="collapseThree" class="accordion-body collapse">
      <div class="accordion-inner">
      <ul>
      <li>
       blah blah blah blah blah
        </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading btn-primary">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseFour"><div class="icon-chevron-down icon-white pull-left"></div>
        Follow Us
      </a>
    </div>
    <div id="collapseFour" class="accordion-body collapse">
      <div class="accordion-inner">
       <ul>
      <li>Facebook</li>
      <li>Twitter</li>
      <li>Instagram</li>
      <li>LinkIn</li>
      </ul>
      </div>
    </div>
  </div>
</div>
</div><!---Background of Accordions--->
   </div>

Answer 1

您的代码在我的浏览器中运行良好。

也许它正在从其他 css 文件中占用空间。请在单独的文件中尝试。

或者找到它占用空间的位置并将其删除。