为什么我的手风琴有间隙,甚至间距我把边距和填充0px

时间:2013-08-01 07:57:17

标签: html css wordpress twitter-bootstrap accordion

我正在用Bootstrap为我的教会制作一个网站并将其制作成Wordpress ..我想知道为什么当我分离所有Wordpress文件时手风琴就像这样。

enter image description here

蓝色的条纹应该是接触的,它不应该在手风琴的标题下方和上方留下空间的那么厚。

假设看起来像这样:enter image description here

以下是关于手风琴的所有内容:

 .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>

1 个答案:

答案 0 :(得分:2)

您的代码在我的浏览器中正常运行。

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

或者从占用空间的地方找到并将其删除。