Question

我有回应问题。每当我缩小页面时，右边的div会碰到左边的div。一个在图片后面，其他人在段落中。这似乎是满溢的，为什么这么说。

＆＃13;

.list-group {
  margin: 0 auto;
}

.list-group div {
  background-color: ;
  height: 200px;
}

.list-group h3 {
  color: #175C85;
}

.list-group .pic {
  background-image: url(../images/AdobeStock_52854917_WM.jpeg);
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 4px;
  margin-right: 50px;
  margin-left: 30px;
}

＆＃13;

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  </head>
  <body>
    <div class="container">
      <div class=" list-group col-sm-12 col-md-10">
        <div class="row">
          <div class="col-sm-6">
            <h3>One All-Inclusive Fee</h3>
            <p>There are no hidden fees or additional charges when working with Nevada Corporate Headquarters, Inc. (NCH). There is one initial fee and it includes the entire process. NCH pays for all initial state filings, account set up fees and expedite
              services for both. NCH gives you one all-inclusive fee—one time; an offer unmatched by our competitors.</p>
          </div>
          <div class="col-sm-6">
            <h3>One-Stop Shop</h3>
            <p>NCH will facilitate the entire process from start to finish—your one-stop solution. This includes, but is not limited to, creating the entity, entity documents, new retirement account(s), rollovers, transfer of the investment(s) into your entity—all
              performed and produced by NCH.</p>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6 img-div">
            <div class="pic">
            </div>
          </div>
          <div class="col-sm-6">
            <h3>Limit Your Ongoing Custodial Fees</h3>
            <p>NCH’s fee schedule is simple. There are no transactional fees after the Self-Directed structure has been completed. After the first year, the ongoing maintenance fees are limited, regardless of the size of your account. Through NCH’s process
              you will not be penalized as the value of your retirement account increases.</p>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-6">
            <h3>Experience and Thoroughness</h3>
            <p>NCH has established thousands of self-directed retirement accounts, helping individuals take advantage of potentially more secure and more lucrative investments for their retirement. We facilitate the implementation of all documents, ensuring
              that all requirements have been met and you maintain full signature authority on behalf of your self-directed retirement account. With over 25 years of experience, our systematic approach has proven to be effective and timely, putting you
              in control as quick as possible.</p>
          </div>
          <div class="col-sm-6">
            <h3>Ongoing Education and Coaching</h3>
            <p>Once your new structure is in place, questions will most certainly arise. NCH provides ongoing coaching and education via email or our toll-free hotline, to help guide you through the first six months of implementation. Unlike most of our competition,
              NCH employs and trains a knowledgeable self-directed staff. Regardless of the questions you have—they are simply an email or phone call away from being answered.</p>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>

＆＃13;

Answer 1

删除高度

.list-group div {
 background-color: ;
 /* height: 200px; */
}

Answer 2

我把你的代码放到jsFiddle中并删除了一些css，它似乎解决了这个问题。

.list-group div{
   background-color:;
   //height: 200px;
}

https://jsfiddle.net/DTcHh/19303/

为什么div会发生冲突？

2 个答案: