Форма в одном столбце и текстовом абзаце в другом столбце

Question

Как я могу получить форму на одной стороне контейнера и текст-абзац с другой стороны? Я решил, что если я поместил все это в контейнер с одной строкой из двух столбцов, это сработает, но по какой-то причине текст абзаца появится под формой слева.

Это скриншот того, что происходит на основе кода, который у меня есть сейчас.

<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; 
} 

Я только начал учиться код, поэтому я прошу прощения, если это кажется глупым вопросом. Я искал вокруг и не мог найти ответ нигде.

Спасибо заранее!

Answer 1

Изучите HTML и CSS правильно, прежде чем задавать какие-либо вопросы.

1. Нет правила CSS, которое имеет значение full.
2. Не дайте padding по полной цене width.
3. Вы забыли добавить класс container.
4. Множество недействительных 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