使内部列表项填充bootstrap中的父列表项

Question

我想通过强制内部列表项填充其父列表项来消除以下嵌套列表项中的边距。见JSFiddle:

<div class="container">
 <div class="panel panel-default">
   <div class="panel-heading">
     This is the heading
   </div>
   <div class="panel-body">
     <ul class="list-group parentList">
       <li class="list-group-item">
         Hello
       </li>
       <li class="list-group-item  nomargin">
         <ul class="list-group childList">
           <li class="list-group-item  nomargin">
             Hello.Child 1
           </li>
           <li class="list-group-item child">
             Hello.Child 2
           </li>
         </ul>
       </li>
     </ul>
   </div>
 </div>

这是css：

.nomargin {
  margin-left: 0px !important;
  margin-right: 0px !important;
  margin-top: 0px !important;
  margin-bottom: 0px !important
 }

.parentList {
  display: inline-block;
  position: relative;
}

.childList {
  width: 100%;
 }

Answer 1

这些空间由填充引起，因此您需要添加padding: 0而不是边距

Demo