并排内联块div，最后一个错误地在中间对齐

Question

我正在成对地垂直对齐响应div。我使用内联块而不是浮点数。我不能使用flex btw。 在下面的示例中，我有5个div，但最后一个（div5）位于中间而不是左对齐。我不明白为什么。

有什么建议吗？

发生的事情是：

div1  div2
div3  div4  
   div5   

instead of:

div1 div2
div3 div4
div5

CSS和HTML：

div-container{
  margin: 0 auto;
  width: 95%;
}
    
div{
  display: inline-block;
  width: 48%;
  margin-right: 4%;
  margin-bottom: 4%;
}
    
div:nth-child(2n+2) {
  margin-right: 0;
}


  
       

<div class="div-container"><div>
     <div class="image-box">
       <a href="#" title="tile">
                        <img class="img-teaser" src="./img/partner1.png" alt="Partner 1 image">
                      </a>
                    </div>
    
                    <div class="content-box">
                      <div class="text-box">
                          <a href="#" title="card">
                            <h3>Hea</h3>
                          </a>
                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ultricies non nisi id pellentesque. </p>
                      </div>
                    </div>
                  </div>
    
     <div>
                   <div class="image-box">
                      <a href="#" title="tile">
                        <img class="img-teaser" src="./img/partner1.png" alt="Partner 1 image">
                      </a>
                    </div>
    
                    <div class="content-box">
                      <div class="text-box">
                          <a href="#" title="card">
                            <h3>Hea</h3>
                          </a>
                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ultricies non nisi id pellentesque. </p>
                      </div>
                    </div>
                  </div>
    
     <div>
                   <div class="image-box">
                      <a href="#" title="tile">
                        <img class="img-teaser" src="./img/partner1.png" alt="Partner 1 image">
                      </a>
                    </div>
    
                    <div class="content-box">
                      <div class="text-box">
                          <a href="#" title="card">
                            <h3>Hea</h3>
                          </a>
                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ultricies non nisi id pellentesque. </p>
                      </div>
                    </div>
                  </div>
    
     <div>
     <div class="image-box">
                      <a href="#" title="tile">
                        <img class="img-teaser" src="./img/partner1.png" alt="Partner 1 image">
                      </a>
                    </div>
    
                    <div class="content-box">
                      <div class="text-box">
                          <a href="#" title="card">
                            <h3>Hea</h3>
                          </a>
                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ultricies non nisi id pellentesque. </p>
                      </div>
                    </div>
                  </div>
    
     <div>
                    <div class="image-box">
                      <a href="#" title="tile">
                        <img class="img-teaser" src="./img/partner1.png" alt="Partner 1 image">
                      </a>
                    </div>
    
                    <div class="content-box">
                      <div class="text-box">
                          <a href="#" title="card">
                            <h3>Hea</h3>
                          </a>
                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ultricies non nisi id pellentesque. </p>
                      </div>
                    </div>
                  </div>
    </div>

Answer 1

尝试将text-align: left;添加到div-container

Answer 2

尝试使用此代码段，将text-align:center添加到父div，这将使最后一个div保留

.all-box {
	width:400px;
	margin:0 auto;
	text-align:left;
}
.box {
	width:49%;
	display:inline-block;
	height:100px;
	background:#666;
}

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<div class="all-box">
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
</div>
</body>
</html>

Answer 3

尝试删除

private void MyForm_FormClosing(object sender, FormClosingEventArgs e)
{

    if (FLAG_CONDITION == true)
    {
        MessageBox.Show("To exit save the change!!");
        e.Cancel = true;
    }

}

表示div标签