Question

我在bootstrap文档中有以下结构 -

 <div class="col-lg-6 col-sm-6>
  <ul class="stdULGrey st_tabs_ul">
       <li class="st_li_first st_li_active">
           <a href="#view_1" class="st_tab st_tab_first st_tab_active">
                <span class="icoMore icoA"></span>
                <span class="tabText">WANT TO KNOW MORE?</span></a>
       </li>
       <li>
           <a href="#view_2" class="st_tab">
                <span class="icoWhereTo icoA"></span>
                <span class="tabText">WHERE TO FIND US?</span>
           </a>
       </li>

</ul>

span元素 - icoMore包含一个背景图片 - 我想响应bootstrap父级的全部宽度 - 我尝试了以下代码 -

    .icoMore{background:url(../img/logos%20and%20icons/Wanttoknow_Icon_Off.png) no-repeat; min-width:100%; min-height:auto; display:block; }

但它显示零宽度和高度 - 任何人都可以建议解决方案吗？

Answer 1

将display: block添加到span。这应该足够了。

Answer 2

您需要在<span>中添加任何字符，甚至是空格，例如：

<span>&nbsp;</span>

检查这个小提琴：

http://jsfiddle.net/dimaspante/5j6vt0mk/

跨度 - 父级的100％宽度

2 个答案: