CSS textarea positionning

Question

Я начинаю на CSS.

Я хочу разместить текстовое поле справа и карту влево. Но поле отображается на карте.

Вот мой CSS

#CoordData { 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    font-size: .9em; 
 
    // position: absolute; 
 
    \t \t left: 10px; 
 
    \t \t right: 10px; 
 
} 
 
#wrapper { 
 
        position: absolute; 
 
        left: 400px; 
 
        // right: 10px; 
 
        top: 10px; 
 
        bottom: 10px; 
 
       } 
 
.Button { 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    font-size: .6em; 
 
    // position: absolute; 
 
    \t \t left: 200px; 
 
    \t \t // right: 10px; 
 
}

Может кто-нибудь мне помочь, пожалуйста?

Вот мои code и here на весь экран.

Answer 1

Вы ч просто изменить ваш jsfiddle как this

где просто изменить абсолютную positione вашего #wrapper таким образом

#wrapper { 
       position: absolute; 
       //left: 400px; 
       right: 20%; 
       top: 1px; 
       bottom: 10px; 
      } 

Answer 2

Вы можете использовать классы .pull-left и .pull-right в пользовательском интерфейсе Twitter Bootstrap Twitter или фреймворке начальной загрузки, разделив страницу на 12 сеток, чтобы вы могли использовать 6 сеток для карты и 6 сеток для текста.

для справки на сетках: http://www.w3schools.com/bootstrap/bootstrap_grid_basic.asp

для справки на выдвижной слева: http://www.tutorialrepublic.com/codelab.php?topic=bootstrap&file=pull-left-class

надеюсь, что его полезно.