2013-07-16 3 views
0

Как я могу сохранить поля ввода в строке в каждом диапазоне текучей среды?Загрузочный лоток: Сохранение полей ввода inline в диапазоне текучести

  <div class="row-fluid show-grid"> 
       <div class="span6"><label>First Name:</label><input type="text"/></div> 
       <div class="span6">span6</div> 
      </div> 
      <div class="row-fluid show-grid"> 
       <div class="span6">span6</div> 
       <div class="span6">span6</div> 
      </div> 
      <div class="row-fluid show-grid"> 
       <div class="span6">span6</div> 
       <div class="span6">span6</div> 
      </div> 

Я собираюсь динамически генерировать каждую строку. Попробовал изменить display: на inline или inline-block в show-grid класс, но он не работал.

.show-grid [class*="span"] { 
    background-color: #ddd; 
    text-align: left; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
    min-height: 40px; 
    line-height: 40px; 
    margin-top: 10px; 
    display: inline; 
} 
+0

попробуйте изменить ярлык на встроенный или встроенный блок, возможно, что вызывает проблему – Kamil

+0

Это не сработало! –

ответ

1

Вы можете использовать класс form-inline в каждом span6:

http://jsfiddle.net/TTVG8/

HTML

<div class="row-fluid show-grid"> 
    <div class="span6 form-inline"> 
     <label>First Name:</label> 
     <input type="text" /> 
    </div> 
    <div class="span6">span6</div> 
</div> 
<div class="row-fluid show-grid"> 
    <div class="span6">span6</div> 
    <div class="span6">span6</div> 
</div> 
<div class="row-fluid show-grid"> 
    <div class="span6">span6</div> 
    <div class="span6">span6</div> 
</div> 

CSS

@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css'); 
.show-grid[class*="span"] { 
    background-color: #ddd; 
    text-align: left; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
    min-height: 40px; 
    line-height: 40px; 
    margin-top: 10px; 
    display: inline; 
} 
0

Kamil is right. Изменение в display:inline, или в качестве последнего ресурса float:left;

+0

Вы имеете в виду его замену на этикетку? –