iosheff
Зарегистрирован: 16.04.2002
Сообщения: 17
Откуда: Sevastopol
|
 Добавлено: Пт Май 19 2006 23:59 Заголовок сообщения: поле TEXT и TEXTAREA шириной в 100% и <!DOCTTYPE ... ? |
 |
|
Народ! Кто знает как решить проблему.
Есть таблица. В ней 2 столбца. Там слева название поля, справа - значение.
Левый столбик - ширина к прмеру 200px , правый AUTO.
Ширина таблицы 100% (рамка к примеру 1, отступы -2 расстояния -1 - не суть вжно, но нагляднее).
Если в правый столбик втавить INPUT TEXT или TEXTAREA и дать ему ширину 100% (css), то это злое поле получается шириной ровно до конца ячейки таблицы - перекрывая границу таблицы и отступы внутри ячейки (padding) . Т.е. емея форму типа название - значение форматтироование сползает напроч. Самое интерестное, что остальные элементы WEB-страницы (select) позиционируются нормально, учитывая рамку и т.д.
И самое главное: все работает хорошо, если не указывать с начале HTML документа конструкцию DOCTYPE.
Но страница для правильной работы (в ней используется компонент на JS, который написан на XHTML) требует конструкцию DOCTYPE. Я раньше ей не пользовался, теперь понял, вещь очень важная, особенно для DHTML и XHTML.
Вот код. Попробуйте. Может кто найдет решение проблемы.
Проверял в IE 6 и Firefox 1.5 (ранние не интересуют) А DOCTYPE в IE имеет большое значение!
| Код: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
</head>
<style type="text/css">
TABLE { width: 100%; border: 4px single black; border-collapse: collapse ; table-layout: fixed; }
TH { text-align: left; background: #ccc; padding: 5px; border: 1px solid black }
TD { padding-right: 0px; border: 1px solid black }
</style>
<body>
<form name="form1" id="form1" method="post" action="">
<table width="100%" border="1" cellpadding="2" cellspacing="2">
<tr>
<td width="200" >sqws wqddddw wd dw</td>
<td> <input name="textfield" type="text" style="width: 100%;" /></td>
</tr>
<tr>
<td>wsqsqwsqwsq</td>
<td><select name="select" size="1" style="width: 100%;">
<option>1</option>
<option>2</option>
</select></td>
</tr>
<tr>
<td>swswswdwedw</td>
<td><textarea name="textarea" style="width:100%"></textarea></td>
</tr>
</table>
</form>
</body>
</html>
|
Ссылки по DOCTYPE
http://htmlcoder.visions.ru/CSS/?11
http://htmlcoder.visions.ru/CSS/?9 |
|
FAQ 
Поиск 
Пользователи 
Группы
Регистрация
Профиль 
Войти и проверить личные сообщения 
Вход 
