Question

嘿，我有一个DIV和一个HR推出他们的容器。我尝试了几种不同的修复方法，但似乎没有任何效果。我把所有东西放在一个小提琴中，这样你就可以看看我在谈论什么。任何帮助将不胜感激。

＆＃13;

body {
  margin: 0;
  padding: 0;
}

.img {
  float: left;
  width: 100px;
  height: 100px;
  position: relative;
  top: 0;
  left: 0;
}

.copy {
  position: relative;
  float: left;
  margin-left: 10px;
}

.leadMargin {
  margin-left: 10px;
  postion: relative;
}

.hr {
  clear: both;
  border: 3px solid #f5f5f5;
  margin-top: 110px;
  margin-right: 100px;
  position: relative;
}

.noMargin {
  margin: 0;
}

.position-relative {
  position: relative;
}

.position-absolute {
  position: absolute;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<body>


<div class="container-fluid">
  <h1 class="">Post Block</h1>
  <hr>
</div>
<div class="container-fluid">
  <div class="row">
    <div class="col-md-5">
      <img src="http://www.placehold.it/400X200" class="img-responsive"  alt="placeholder image" />
      <p class="lead">Responsive Design</p>
      <p>Bacon ipsum dolor amet beef ribs turkey ut et cillum, capicola culpa turducken t-bone. Adipisicing officia pork loin, nulla andouille in eu capicola. Landjaeger pork chop sed kielbasa boudin aliqua. Salami pork ground round, jerky fatback ut eiusmod.
        Nisi ball tip do pig shankle turducken. Velit nisi t-bone pork tail corned beef salami pancetta cupidatat sirloin eu sint jowl. Qui cow voluptate pastrami.</p>
    </div>
    <div class="col-sm-5 col-md-5">
      <div class="container-fluid">
        <div class="row">

          <img src="http://www.placehold.it/100x100" class="img " alt="lady with senior lady" />

          <div class="col-sm-5 col-md-5 ">
            <p class="lead noMargin">New Collection of Shortcodes</p>
            <p>Landjaeger pork chop sed kielbasa boudin aliqua. Salami pork ground round, jerky fatback ut eiusmod. Nisi ball tip do pig shankle turducken.</p>
          </div>
          <hr class="hr">
        </div>

        <div class="row position-relative">
          <img src="http://www.placehold.it/100x100" class="img" alt="lady with senior lady" />
          <div class="col-sm-5 col-md-5">
            <p class="lead noMargin">New Collection of Shortcodes</p>
            <p>Landjaeger pork chop sed kielbasa boudin aliqua. Salami pork ground round, jerky fatback ut eiusmod. Nisi ball tip do pig shankle turducken.</p>
          </div>
          <hr class="hr">
        </div>
        <div class="row"> <img src="http://www.placehold.it/100x100" class="img" alt="lady with senior lady" />
          <div class="col-sm-5 col-md-5">
            <p class="lead noMargin">New Collection of Shortcodes</p>
            <p>Landjaeger pork chop sed kielbasa boudin aliqua. Salami pork ground round, jerky fatback ut eiusmod. Nisi ball tip do pig shankle turducken.</p>
          </div>
          <hr class="hr">
        </div>
      </div>
    </div>
  </div>
</div>
</body>

＆＃13;

提前致谢。凯尔

Answer 1

这是双容器类。我有<div class="container container-fluid">。当我删除第一个容器类时，<HR>开始表现。

DIV Row＆amp;人力资源扩展超越容器（引导程序）

1 个答案: