#html #css
#HTML #css
Вопрос:
Как я могу заставить HTML <button> вертикально заполнять ячейку таблицы с помощью CSS?
Я могу использовать width:100% , чтобы заставить кнопку горизонтально заполнять ячейку таблицы с помощью CSS, но height:100% это ничего не делает.
Пример, пожалуйста, смотрите:http://jsfiddle.net/eA5fQ
Спасибо!
Комментарии:
1. Не могли бы вы выразиться немного яснее ..? Чего именно вы хотите добиться с помощью CSS?
2. Процентная высота наследуется от родительского элемента. Если высота родительского элемента не определена, то нет точки отсчета.
Ответ №1:
Вам нужно будет указать высоту в пикселях, как в:
height: 100px;
Комментарии:
1. Спасибо, Кен, это определенно работает, но есть ли какой-нибудь способ сделать это через %, чтобы он просто занимал всю область ячейки таблицы, в которой он находится?
Ответ №2:
Если вы не возражаете против решения на jQuery:
$('#button1').css('height', $('#button1').parent('td').height());
Ответ №3:
Добавьте height:100%; к вашей кнопке и задайте высоту вашего тега td в процентах
Комментарии:
1. да, установите 100% для td и для кнопки внутри td. спасибо, что решили это
Ответ №4:
Если вы используете min-height: 1px; так же хорошо, как height: 100%; , кажется, что это работает нормально: http://jsfiddle.net/jJbCd/8
Комментарии:
1. Я бы хотел иметь возможность использовать%, но это не работает с моей стороны (Firefox 4). Есть идеи, почему? Спасибо.
2. Я не уверен, что понимаю. Высота 100% работает для меня независимо от того, установлена ли минимальная высота или нет. Работает в теге TD и div. jsfiddle.net/jJbCd/9 Также с использованием FF4 (xp)
3. тогда вам это может не понадобиться. 🙂 Если это работает без этого, то уберите это.