Bootstrap：为什么我的 col-md-6 不工作？

Question

我的网站有一点问题。我想要一个使用 Bootstrap 的响应式网站。在我的移动版本中，两列需要彼此重叠，现在是正确的。但是，在我的桌面版本上，各列需要彼此相邻。我认为 col-md-6 是执行此操作的正确方法，但是出了问题...任何人都可以向我解释我做错了什么。？

body {

  padding: 0;

  margin: 0;

  background: #f2f6e9;

  padding-left: 20px;

}

.clearfix:after {

  content: ".";

  display: block;

  height: 0;

  clear: both;

  visibility: hidden;

}

.container {

  margin-top: 20px;

  font-family: 'Roboto', sans-serif;

}

.content {

  margin-top: 30px;

}

.tekstgeel{

  color: #d7a32d;

}

.tekstgroen{

  color: #4a7b45;

}

.bold {

  font-weight: bold;

}

.lijngeel{

  height:4px;

  width: 50px;

  background-color: #d7a32d;

  float: left;

  margin-top: 10px;

}

img {

  width: 100%;

}

.titel {

  font-size: 15px;

  text-transform: uppercase;

  line-height: 18px;

}

p {

  font-size: 12px;

}

#profielfoto {

  width: 75%;

  margin-top: 15px;

  margin-bottom: 40px;

}

.titel {

  font-size: 15px;

  text-transform: uppercase;

  line-height: 18px;

}

.ondertitel {

  font-size: 13px;

  text-transform: uppercase;

  line-height: 16px;

  margin-top: 15px;

  margin-bottom: 15px;

}

@media only screen and (min-device-width: 768px) {

.titel {

  font-size: 20px;

  line-height: 23px;

}

.col-md-6 {

  border:1px solid black;

}

}

Answer 1

请div row class在 之间添加two div columns。<div class="row">&nbsp; &nbsp; &nbsp; <div class="col-md-12">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<div class="row">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="col-sm-12 col-md-6">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp;</div></div>