在一列中的表格和其他列中的文本段落

如何在容器的一侧上放置一个表格并在另一侧上放置一个文本段落？我想如果我把它全部放在一列两列的容器中，它会工作，但由于某种原因，段落文本显示在左侧的表格下。在一列中的表格和其他列中的文本段落

这是根据我现在的代码正在发生的事情的屏幕截图。

<div class="container-section getintouch"> 
    <h1 class="text-center">Say hello?</h1> 
    <div class="row"> 
     <div class="col-xs-6"> 

     <form> 
      <div class="form-group"> 
       <input type="text" class="form-control no-border  
       placeholder="Email"> 
      </div> 
      <div class="form-group"> 
       <input type="text" class="form-control no-border"  
       placeholder="Email"> 
      </div> 
    <textarea class="form-control no-border" rows="5" id="comment"></textarea> 
      </div> 
      </form> 

     </div> 
     <div class="col-xs-6"> 
     <h3>Want to say hello? It's always nice meeting new people. Fill out 
      this form to the left and I'll reply to you as soon as I can :)  
     </h3> 
     </div> 
    </div>enter code here 

.container-section{ 
    width: full; 
    height: full; 
    margin: 0 auto; 
    padding: 100px; 
    color: white; 
} 

.getintouch{ 
    background: #9dd1f1; 
}

我刚开始学习代码，所以我很抱歉，如果这似乎是一个愚蠢的问题。我四处搜寻，无法在任何地方找到答案。

预先感谢您！

来源

2017-01-01 Joe P.

您是否甚至可以看到您的问题在您发布时的显示方式？ –

对不起，我没有看到！我想我解决了它。 –

在问任何问题之前，请正确学习HTML和CSS。

没有CSS规则的值为full。
不要给padding充分width。
您忘记了添加一个container类。
很多无效的HTML，未关闭和东西。

片段

.container-section { 
 
    -margin: 0 auto; 
 
    -color: white; 
 
} 
 
.getintouch { 
 
    background: #9dd1f1; 
 
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> 
 
<div class="container-section getintouch"> 
 
    <h1 class="text-center">Say hello?</h1> 
 
    <div class="container"> 
 
    <div class="row"> 
 
     <div class="col-xs-6"> 
 
     <form> 
 
      <div class="form-group"> 
 
      <input type="text" class="form-control no-border" id=formGroupExampleInput " placeholder="Name ""> 
 
      </div> 
 
      <div class="form-group"> 
 
      <input type="text" class="form-control no-border" id=formGroupExampleInput2 " placeholder="Email ""> 
 
      </div> 
 
      <div class="form-group"> 
 
      <textarea class="form-control no-border" rows="5" id="comment"></textarea> 
 
      </div> 
 
     </form> 
 
     </div> 
 
     <div class="col-xs-6"> 
 
     <h3>Want to say hello? It's always nice meeting new people. Fill out this form to the left and I'll reply to you as soon as I can :)</h3> 
 
     </div> 
 
    </div> 
 
    </div>

预览

输出：http://jsbin.com/mepiripeju/edit?html,css,output

来源

2017-01-01 01:55:05

在一列中的表格和其他列中的文本段落

回答

相关问题