Добавить вход выше таблицы

Question

Добавить вход выше таблицы

0

Как вы можете видеть в моем HTML, у меня есть две таблицы. Теперь я хотел бы добавить входные данные после каждой таблицы:

1. Показывает, как выглядел мой Html без span и input s

2. Показывает, как это выглядит сейчас: http://jsfiddle.net/tLHSB/2/

3.Как я хотел бы иметь это

Спасибо за вашу помощь!

Мой HTML:

<span>
<table class="table table-bordered" style="font-size:13px; width:50px; float:left;" id="ScheinDiagnosen">
  <thead>
    <tr id="DiagnosenButton">
       <th>Number1</th>
    </tr>
  </thead>
  <tbody id="DiagnosenBlock"  style="background-color: red">    
      <tr class="sanD"><td>H26.2</td></tr>
      <tr class="sanD"><td>H90.2</td></tr>
      <tr class="sanD"><td>B01.1</td></tr>
      <tr class="sanDD"><td>B01.1</td></tr></tbody>
</table>
  <input style="width:10px; display:block">
</span>
<span>
<table class="table table-bordered" style="font-size:13px; width:50px; float: left;" id="ScheinEbms">
  <thead>
    <tr id="EBMButton">
       <th>Number</th>
    </tr>
  </thead>
  <tbody id="EbmBlock" style="background-color: blue;">

  <tr><td>02401</td></tr>
  <tr><td>02400</td></tr>
  <tr><td>03322</td></tr>
</tbody>
</table>
  <input style="width:10px;display:block"> 
</span>

John Smith 18 апр. 2014, в 17:45

Источник

Теги:

html

css

2 ответа

1

Добавьте это в свой css:

span {
    float:left;
}

И удалите float:left от вашего стиля table.

Проверьте это здесь: http://jsfiddle.net/tLHSB/5/

potashin 18 апр. 2014, в 12:35

0

Ваш код в настоящее время не выравнивает таблицы сверху, как указано.
Palpatim 18 апр. 2014, в 15:19

Ещё вопросы

Ваш код в настоящее время не выравнивает таблицы сверху, как указано.

Palpatim · Accepted Answer · 2014-04-18T13-31-00.000Z

Проблема в том, что вы плаваете ваши таблицы, что заставляет их выходить из потока документов. Есть несколько способов выполнить то, что вы хотите, но попробуйте заменить элементы span на div и поместить их вместо таблиц.

Кроме того, не используйте встроенные стили, используйте блок CSS. Это улучшит ваш код в долгосрочной перспективе.

Заменяя свой span на div s и удаляя встроенные стили, ваш новый CSS будет выглядеть так:

table {
    font-size:13px;
    width:50px;
}
#DiagnosenBlock {
    background-color: red;
}
#EbmBlock {
    background-color: blue;
}
div {
    float: left;
}

Демо: http://jsfiddle.net/Palpatim/tLHSB/4/