Высота ячейки таблицы с точки зрения размера шрифта с помощью CSS - PullRequest
2 голосов
/ 21 января 2009

У меня есть таблица (в частности, календарь). Я хочу, чтобы календарь не выглядел уродливо, когда ничего не записано ни для одной из дат, поэтому я хочу, чтобы минимальный размер ячейки был в четыре раза больше высоты шрифта. (То есть, если у меня есть строка календаря, в которой ничего нет, и строка календаря с четырьмя строками текста, я хочу, чтобы они были одного размера).

Везде говорится, чтобы использовать em. Тем не менее, я попытался использовать 4em для моего 12pt шрифта, и он не был близко:

td.day {
    padding: 2px;
    font-size: 12pt;
    width: 14.3%;
    height: 4em;
    vertical-align: top;
}

Я точно посчитал пиксели и шрифт 12pt для того шрифта, который я использую,

font-family: verdana, arial, "sans-serif";

имеет height из 22px. Это не очень гибко, однако ... есть ли лучший способ сделать это?

Думая об этом больше, я уверен, что устройство em правильно сообщает мне высоту шрифта. Он просто не учитывает межстрочный интервал, отступы или что-либо еще в этом роде. Есть ли способ сделать это, что бы?

1 Ответ

2 голосов
/ 21 января 2009

Вы должны принять во внимание ваш множитель высоты строки. Для вашего элемента td, если вы выбрали размер шрифта 12pt, вы также должны назначить высоту строки. Например, если вы хотите высоту строки 18px с размером шрифта 12pt:

td.day {
    font-size: 12pt;
    line-height: 1.5;
}

Только убедитесь, что вы не используете единицу, такую ​​как em или px, для обозначения высоты строки, поскольку она является множителем вашего размера шрифта. Ваша высота строки теперь будет 18px, или, если вы хотите использовать ems, 1.5em. Теперь, если вы хотите назначить высоту в четыре строки, вы должны использовать 6em.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...