Встановлює вертикальне вирівнювання вмісту осередків у рядку. За замовчуванням контент осередку розташовується по її вертикалі у центрі.
Даний атрибут застарів, натомість використовуйте стилі.
Синтаксис
<tr valign="top | middle | bottom | baseline">...</tr>
Значення
- top
- Вирівнювання вмісту осередків по верхньому краю рядка.
- middle
- Вирівнювання посередині.
- bottom
- Вирівнювання по нижньому краю.
- baseline
- Вирівнювання по базовій лінії, при цьому відбувається прив'язка вмісту осередків рядка до однієї лінії.
Значення за замовчуванням
middle
Приклад
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>TR, атрибут valign</title> <style type="text/css"> p {margin-top: 0;}
.pot { background: #800000; color: white; }
.title { font-size: 200%; }
</style>
</head>
<body> <table width="100%" cellpadding="5"> <tr valign="top" class="pot"> <td class="title">Борщ</td> <td><p>М'ясо відварити до готовності. Промити буряк, очистити, нарізати соломкою та тушкувати з помідорами до напівготовності.</p> <p>Бульйон процідити, м'ясо нарізати шматочками. У бульйон додати нарізану часточками картоплю, довести до кипіння, опустити нарізану соломкою свіжу капусту і варити 10-15 хвилин, додати пасеровані овочі, болгарський перець, нашаткований тонкою соломкою, спеції і довести до готовності. <p>Готовому борщу дати настоятися протягом 20-25 хвилин. При подачі до столу додати сметану, м'ясо, зелень.
</p>
</tr>
</table>
</body>
</html>Результат цього прикладу показаний на мал. 1.
Мал. 1. Вирівнювання вмісту осередків по верхньому краю
Примітка
Для вирівнювання вмісту всередині осередків по вертикалі використовуйте стильову властивість vertical-align, додаючи його до селектора tr.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Вирівнювання по вертикалі</title> <style> table { width: 80%; border: 1px solid #000; margin: auto; height: 300px; }
tr { vertical-align: top; }
</style>
</head>
<body> <table> <tr> <td> ...
</td>
</tr>
</table>
</body>
</html>Браузери
| 3 | 12 | 1 | 3.5 | 1 | 1 |
| 1 | 1 | 6 | 1 |
Браузери
У таблиці браузерів застосовуються такі позначення.
- — елемент повністю підтримується браузером;
- — елемент браузером не сприймається та ігнорується;
- — при роботі можлива поява різних помилок, або елемент підтримується з застереженнями.
Число вказує версію браузреа, з якої елемент підтримується.