, которая принимает только одну ячейку
blockquote>, это ваш ответ. чтобы обмануть его, вам нужно сделать что-то вроде:
=SUM(CalculateProgressionTaxOfSalary(A2); CalculateProgressionTaxOfSalary(A3); CalculateProgressionTaxOfSalary(A4); CalculateProgressionTaxOfSalary(A5); CalculateProgressionTaxOfSalary(A6); CalculateProgressionTaxOfSalary(A7); CalculateProgressionTaxOfSalary(A8); CalculateProgressionTaxOfSalary(A9); CalculateProgressionTaxOfSalary(A10))
Я нахожу, что списки определения имеют намного больше смысла, чем таблицы здесь. Плавайте dt
налево с определенной шириной и имеют его ясный слева. Если или маркировка или данные собираются перенестись, необходимо будет сделать некоторый post-element-float-clearing обман для создания этой работы, но это не кажется на необходимость в этом. (Я думаю, что это стоит того, так или иначе; плюс, сделайте это однажды, и Вы никогда не должны будете делать этого снова.)
Можно даже использовать :after
добавить двоеточия автоматически, если Вы не возражаете стряхивать IE6.
Не слушайте людей, говорящих, что это - табличные данные. Просто, потому что что-то было представлено в строках, это не делает это таблицей!
Это - большая ситуация для использования dl
, dt
и dd
теги. Это - что-то вроде фрагмента от того, для чего они первоначально предназначаются, но это все еще намного более значимо, чем таблица, промежутки или отделения.
<dl>
<dt>Street</dt>
<dd>Example Street 1</dd>
<dt>City</dt>
<dd>Vienna</dd>
<dt>Zip Code</dt>
<dd>1010</dd>
<dt>Country</dt>
<dd>Austria</dd>
</dl>
И CSS:
dt {
width: 150px;
float: left;
clear: left
}
dd {
float: left;
}
Это - довольно основной CSS - он, вероятно, не будет содержать много ситуаций (например: два dd
подряд, действительно длинное dt
), но это - запуск. Посмотрите на inline-block
свойство для dt
, и возможно вместо использования float
луг, Вы могли установить a left-margin
из 150px
на dd
.
Я думаю, что Вы взяли "таблицы, плохое" понятие до крайности.
Что у Вас есть соответствия очень приятно в понятие строк и столбцов с заголовками (<th>
) и данные (<td>
) – на основе семантики, не только расположения.
Если Вы хотите сделать это более явным, что это - адрес, то используйте adr Микроформат или добавьте a <caption>
.
Неправильные подходы:
<dl>
: "1010" не определение "почтового индекса". Наоборот это имеет немного больше смысла, но отношения так же ясны с <th>
→ <td>
, это не полагается на CSS и посмотрит идеальный regearless размера шрифта пользователя.<th>
будет отлично представлен даже у рыси! Адрес в <dl>
без CSS прием будет выглядеть странным.<address>
элемент не может подходить для этого, потому что он предназначается только для страницы контактная информация author's/maintainer's. Это также позволяет встроенное содержание только, таким образом, Вы потеряли бы структуру адреса.Как другие упомянули, плавали, элементы являются способом пойти сюда.
Это было бы моим решением:
<p class="details">
<span class="label">Street:</span>
Some Street or other.
<br />
<span class="label">City:</span>
A City.
<br />
</p>
С CSS, который похож на это:
p.details {
padding-left: 200px;
}
p.details span.label {
float: left;
clear: left;
width: 200px;
margin-left: -200px;
}
Поскольку основной текст не плавает, это избегает любых проблем, где тот текст длинен и должен перенестись; это останавливает плавающее становление элемента к широкому и затем плавание ниже маркировки. Это означает, что никакие особые случаи не необходимы для того, когда этот текст является мультилинией любой, скажем, если Вы хотели иметь многострочный адрес.
Точно так же этот метод также работает, если данные маркировки должны перенестись по нескольким строкам, так как следующая маркировка очищает предыдущее плавание.
Наличие разрывов строки там означает, что также ухудшается приятно и похоже на Вас, ожидал бы если не использовать CSS.
Этот метод работает очень хорошо на разметку форм, где <label>
элементы используются вместо промежутков, и абзацы могут быть выбраны в CSS как любой абзац, который является ребенком a <form>
.
Никакая потребность в таблицах (не, что таблицы были бы действительно несоответствующими в этой установке). Я делаю такого рода вещь все время.
<div class=DetailsRow>
<div class=DetailsLabel>Street</div>
<div class=DetailsContent>123 Main Street</div>
</div>
<div class=DetailsRow>
<div class=DetailsLabel>City</div>
<div class=DetailsContent>Vienna</div>
</div>
...etc
и
div.DetailsRow
{
clear:both;
}
div.DetailsLabel
{
float:left;
width:100px;
color:gray;
}
div.DetailsContent
{
float:left;
width:400px;
}
Или вы можете отбросить всю разумность (и семантику) и воссоздать таблицы с помощью CSS (проверено в Firefox и Chrome):
<html>
<head>
<title>abusing divs</title>
<style type="text/css">
div.details {
display: table;
}
div.details > div {
display: table-row;
}
div.details > div > div {
display: table-cell;
padding-left: 0.25em;
padding-right: 0.25em;
}
</style>
</head>
<body>
<div class="details">
<div>
<div>Street</div>
<div>123 Main Street</div>
</div>
<div>
<div>City</div>
<div>Vienna</div>
</div>
<div>
<div>This is a very very loooong label</div>
<div>...</div>
</div>
</div>
</body>
</html>
Шучу.