CSS: удалите всю прописку из ячейки с полем ввода

Question

У меня есть строка таблицы с полем ввода в каждой ячейке, которая используется для фильтрации столбца.

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

Примечание: Это необходимо только для одной конкретной строки, все остальные строки останутся в стандартном формате.

Мой тр выглядит следующим образом:

// ... 
<tbody> 
    <tr> 
     <td><input type="text" name="input1" /></td> 
     <td><input type="text" name="input2" /></td> 
     <td><input type="text" name="input3" /></td> 
    </tr> 
// ... 
</tbody> 

Большое спасибо за любую помощь с этим, Тим.

Answer 1

Во-первых, добавить класс к:

<tbody> 
    <tr class="noPadding"> 
     <td><input type="text" name="input1" /></td> 
     <td><input type="text" name="input2" /></td> 
     <td><input type="text" name="input3" /></td> 
    </tr> 
</tbody> 

Затем в CSS:

.noPadding td { padding: 0; } 

Если вы обнаружили, что все еще получаете дополнительный шаг может быть несколько полей, применяемые для самих входов (зависит от ваших других настроек CSS/браузера), если это стоит попробовать:

.noPadding td input { margin: 0; } 

Надеюсь, это поможет.

Answer 2

Похоже, что вы видите, это запас, созданные поля формы по умолчанию, попробуйте следующее:

Css быть помещены в тегах стиля в голове:

.noMargin { margin: 0; } 

Подсказка: вы можете назначить маржу значение минус царствовал в пространстве более, в данном случае:

.noMargin { margin: -2px; } 

работал для меня (с помощью сафари, но будет варьироваться в зависимости от браузера)

Ваш HTML:

<tbody> 
<tr> 
    <td><input type="text" name="input1" class="noMargin" /></td> 
    <td><input type="text" name="input2" class="noMargin" /></td> 
    <td><input type="text" name="input3" class="noMargin" /></td> 
</tr> 
</tbody> 

Я надеюсь, что это помогает.

Answer 3

Вы можете использовать JQuery для удаления отступов всех таблиц с.в., где он имеет текстовые поля ввода

$(function() { 
    $('.myTable').find(':text').parent('td').css('padding','0'); 
}); 

, как показано на http://jsfiddle.net/WTBsp/1/