yeg

Огромное спасибо! Действительно, это сработало! Странно, почему я был уверен, что так делать нельзя... Должно быть, я пришел к ложным выводам, наблюдая за поведением элементов в самом начале верстки. Еще раз спасибо!

1. Если задать фиксированную ширину, это проблемы, к сожалению, не решит. Потому что во всех браузерах единица атрибута size поля input имеет разную фиксированную ширину. 2. А если перед полем "Индекс" в ту же строчку поставить еще один input такой же длины, как и поле сверху? Сделать его disabled, все границы и фон сделать белыми, чтобы его не было видно. Тогда низ и верх во всех браузерах будут меняться синхронно. Я пытался так сделать, только не смог грамотно сверстать. Поля то наезжали друг на друга, то вообще уезжали в другой угол конец страницы. Я подозреваю, что опытный верстальщик справился бы с такой задачей довольно быстро. Может кто подскажет в примерах?

Добрый день! Мне необходимо реализовать форму, которая бы внешне выглядела как бумажный конверт. Верстка блочная, "резиновая". Все получилось, кроме одной вещи. Имеем два поля ввода: "Откуда" и "Индекс места отправления". Во всех браузерах выглядеть должно так: Поле "Индекс" должно заканчиваться там же, где и поле "Откуда", пиксель в пиксель. Иначе получится не как на настоящем конверте. Сейчас мой код хорошо отображается в FireFox, но в других браузерах индекс съезжает то влево, то вправо. Код CSS: input { position:absolute; margin:0; border-top:0; border-left:0; border-right:0; border-bottom:1px solid #70aae8; padding-left:0.4em; font-size:9pt; } label span { font-family:serif; font-style:italic; color:#70aae8; } label.index { display:inline; position:relative; border-left:1px solid #70aae8; border-right:1px solid #70aae8; border-bottom:1px solid #70aae8; padding:0.2em; width:13em; margin-left:13.7em; margin-top:0; clear:none; } label.index input { border:0; position:relative; } Код HTML: <label for="from_address"><span>Откуда</span> <input maxlength="100" size="56" id="from_address"> </label> <label for="from_index" class="index"><span>Индекс места отправления</span> <input maxlength="6" size="6" id="from_index"> </label> В этом решении, input "Откуда" имеет границу снизу, а label "Индекс" имеет три границы, кроме верхней, и сдвинут влево от края на определенное фиксированное расстояние. Проблема заключается в том, что длина input задается атрибутом size, а сдвиг поля "Индекс" задается в em (или в любых других относительных единицах). У всех браузеров size получается разный по отношению к этом сдвигу. Как сделать, чтобы во всех браузерах отображалось как надо?