旋转木马重叠列Bootstrap

时间:2015-05-09 19:02:06

标签: css twitter-bootstrap

引导程序的新功能 - 轮播图像在其下方的嵌套列中覆盖文本时出现问题。结构如下 - 不确定为什么它的重叠嵌套列

非常感谢任何建议/帮助

<div class="container-fluid">
  <div class="row">
    <div class="col-lg-4 col-md-4 col-sm-3 col-xs-3">
      <h1 id="logo">test</h1>
    </div> 
    <div class="col-lg-8 col-md-8 col-sm-9 col-xs-9 brownbg">
      <div class="row">
        <div class="sidebar-nav">
          <div class="navbar navbar-default" role="navigation">
            <div class="navbar-header">
              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </button>
              <span class="visible-xs navbar-brand"></span>
            </div>
            <div class="navbar-collapse collapse sidebar-navbar-collapse">
              <ul class="nav navbar-nav">
                <li class="active"><a href="/" class="selected">menu1</a></li>
                <li><a href="index2.html">Menu2</a></li>

              </ul>
            </div><!--/.nav-collapse -->
          </div>
        </div>
      </div>

      <div class="row">
        <div id="myCarousel" class="carousel slide" data-ride="carousel">
          <div class="carousel-inner" role="listbox">
            <div class="item active">
              <img src="images/photos/1.jpg" width="771" height="292"> 
            </div>
            <div class="item">
              <img class="second-slide" src="images/photos/2.jpg" alt="Homeopathy 2">
            </div>
          </div>
        </div><!-- /.carousel -->
      </div>

      <h2 id="logo2">text</h2>

      <div id="menu-line"><!-- -->
        <div class="clearfix"></div>
      </div>
      <div class="clearfix">&nbsp;</div>
    </div>
    <div class="clearfix">&nbsp;</div>
    <div class="col-lg-4 col-md-4 col-sm-3 col-xs-3">
  </div> 

  <div class="col-lg-5 col-md-5 col-sm-9-offset-0 col-xs-9 brownbg" id="C1">

      text here

      <img src="images/img1.png" width="163" height="55" alt=" " style="margin: 20px 0 0 0;" />

  </div>

  <div class="hidden-lg hidden-md col-sm-3 col-xs-3"></div> 
  <div class="col-lg-3 col-md-3 col-sm-9 col-xs-9 brownbg" id="C2">

      <div style="border-bottom: 2px dashed #000;margin-top:30px;padding:20px 10px;">
        <p class="cyan large">Text</p>
        <p>text</p>
      </div>

  </div>
</div>
<div class="row">
  <div class="col-lg-4 col-md-4 col-sm-3 col-xs-3">
</div> 
<div class="col-lg-5 col-md-5 col-sm-9-offset-0 col-xs-9 footerbg" id="C3">
  text
</div>
</div>
<div class="hidden-lg hidden-md col-sm-3 col-xs-3"></div> 

</div>
</div>
</div>

0 个答案:

没有答案