将容器边距设置为0时如何对齐bootstrap colums？

Question

我有一个关于将两个引导div在水平方向上彼此对齐的问题，而左图像是＃34;在一个div＆＃34;应该没有左边和右边文字的边距＆＃34;在另一个div＆＃34;应该在图像左侧居中。右边的div可能有一些边缘 出于某种原因，当我将两个div设置为彼此并将margin设置为0时，我会在图片中收到此结果。

可以看出，div与另一个重叠，为什么会发生？为了使它在中心正确对齐，我需要做些什么？ 我尝试使用col-md-offset-1，但它只显示在图片下方。我能做些什么来保持它正确对齐？

这是我的html / css：

＆＃13;

＆＃13;

.row-provider-signup {
  margin-top:6em;
  margin-bottom:4em;
  text-align:center;
}

.container-provider-signup > [class*="container"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left:0;
  margin-right:0;
}

.provider-signup-header-text {
  color: #212121;
  font-family: Raleway;
  font-size: 62px;
  font-weight: 400;
  line-height: 72px;
  margin-bottom:1.5em;
}

.provider-signup-body-text {
  color: #616161;
  font-family: Raleway;
  font-size: 16px;
  font-weight: 400;
  line-height: 25px;
  letter-spacing: 0.2px;
  text-align:center;
  margin-bottom:6em;
}

.provider-signup-button {
  width: 150px;
  height: 45px;
  border-radius: 4px;
  background-color: #4a90e2;
}

.provider-signup-button-text {
  color: #ffffff;
  font-family: Raleway;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2.5px;
}

＆＃13;

<div class="container-provider-signup">
    <div class="container">
      <div class="row row-provider-signup">
        <div class="col-md-6">
          <img src="{{route('cacheImage', ['newDesign', 'panorama-signup.png']) }}"/>
        </div>
          <div class="col-md-6">
            <p class="provider-signup-header-text">Test Header</p>
            <p class="provider-signup-body-text">
              Test Text <br/><br/>
              Test Text <br/><br/>
              Test Text <br/>
            </p>
            <button class="btn provider-signup-button"><span class="provider-signup-button-text">SIGN UP</span></button>
          </div>
        </div>
      </div>
    </div>

＆＃13;

＆＃13;

＆＃13;