Формы и размеры
Вообще, немного странно, что до reset.css я добрался только через два месяца возвращения (триумфального, ага) к верстке. Этот пункт обязателен для изучения всем начинающим повелителям HTML. Та самая пресловутая матчасть, чтобы научиться на практике понимать, как ведет себя тот или иной браузер, пользуясь пробелами (как и в случае с SQL) в стандартах Консорциума.
- Обзор ресета в Yahoo НUI (оригинал)
- Обзор ресета Эрика Мэйера (оригинал)
- Дополнения Никиты Селецкого
Сам reset.css можно сделать и отдельный на своем сайте (+1 HTTP-запрос), и приаттачить тот, что лежит у Эрика, или на Yahoo API. Но лучше затачивать решение под себя и помещать прямо в своем CSS.
Собственно, при моей несложной верстке (не резиновой, кстати, — поэтому меня сразу можно зачислить в нубы, ага), и *{padding:0;margin:0;} достаточно было, чтобы верстка смотрелась во всех браузерах. И я не только про «ослика» говорю — с «оперой» мучений тоже достаточно.
Но вот две проблемы мне не удалось решить.
Первая — текст в инпутах IE уродливо сдвигает в самый низ, а кнопку с выделенным жирным текстом увеличивает в размерах (owerflow:visible для них не помог).
Вторая — разнобой ширины всех полей формы комментариев. Из-за нестандартного расположения возникают проблемы с отступами в label, input и textarea. Отчего блок отправки комментария ровный только в IE. В FireFox же вторая строка уже, в Opera — чуть длиннее. Текстареа же «плавает» в пределах пары пикселей.
Подобные траблы возникали уже раза три.
Решение я вижу только одно — не выеживаться, и сделать их обычными, банальными и скучными рядами.
Мое мнение аналогично — прежде, чем ставить чужой резет, стоит точно изучить как поведут себя элементы форм и второе важное, о чем ты не упомянул — не забыть переопределить новые стили для всех тегов, которые могут возникнуть у тебя в контентных областях) Иначе можно получить неприятные ощущения — типа выползания циферок в нумерованном списке за пределы контента в одном браузере и частичного пропадания этих же циферок в другом.
@kodji: Угу, и проблема не только в этом — часть ресетов просто не нужна, что позволяет сэкономить место и запросы. да и всегда надо знать, что делаешь, а не собирать конструкторы. Вот только формы я все равно ненавижу :)
@автор: а их никто не любит, но все пользуются)) ибо других вариантов нету)
Поиск по книгам и инету особо ничего не дал — так и не понял, в чем расхождение между рендерингом форм в разных браузерах. Где ж та мелочь в стандартах, из-за которой все они так мне гадят... ))
@автор: дело в том, что элементы форм — в основном селект и чекбоксы — это системные элементы. их внешний вид и поведение во многом определяется осью. и некоторый кусок повидла в этот бутерброд добавляют браузеры с движками независимыми от оси, но зависимыми от среды разработки, которая берет системные элементы и перекрашивает эти элементы на свой вкус. в стандартах эта мелочь просто не учтена. там описан общий принцип и все)) и нигде не сказано как именно должен выглядеть или работать тот или иной элемент формы. В качестве эксперимента — попробуй сделать селект одинаково выглядящим например в фоксе, опере, сафари и осле )
Ну, про то, как селекты выглядят в разных браузах, я видел не раз :). И все-таки, это не то, что ширина полей и отступы от лейблов. Проблемы похуже, чем в SQL, хотя рекомендательности там куда больше ))).
Спасибо, как-то и забыл подумать о том, что браузы воспринимают их как системные элементы — Сафари же даже скругляет их.
Может и не совсем решение... ибо меняет не верстку, а дизайн, но все-таки:
Из моего firefox'а под ubuntu форма для комментария выглядит так:
Можно сделать такой вариант
:)
Изображения чего-то не вставились
Здесь то что есть:
www.ii4.ru/viewer.php?id=475859Screenshot.png
Здесь то что может быть:
www.ii4.ru/viewer.php?id=...reenshotimod.png
Еще круче. Огнелис под виндой вроде не переносит. Блеять, как же я ненавижу этот мир. Поправлю ща.
Поправил (читай — «перестал выеживаться»). Пришлось по Оперу делать хак. Да и Хрома с Сафари под рукой нет. Сплошные косяки.
на самом деле, чтобы решить вопрос с формой комментариев, тебе достаточно было сделать так (не знаю как себя ведет твой парсер с кодом, посему положил код на отдельной странице) — kodji.name/form.html — особо с оформлением не старался, но думаю основная задача выполнена. будут вопросы — спрашивай)
и где мой коммент? ссылки тоже режутся шоле?
@kodji: Акисмет вдруг заартачился.
Можно и так, спасибо. Только, как по мне, «сообщение» — лишний элемент.
Может, если у лейблов сразу width прописал бы, было нормально. Но так, как сейчас, пойдет.