Я в настоящее время рестайлинг формы, и теперь я борюсь с проблемой CSS:
Чтобы увидеть его, перейдите сюда: http://temp.meyerdevelopment.nl/
Затем нажмите на ссылку «Продолжить», которая находится под «Оформить заказ как
«Гость или Регистрация».
Вы увидите несколько полей, и проблема заключается в расстоянии между полями «Фамилия» и «Компания». Я считаю, что поля элементов должны слиться, что приведет к одинаковому расстоянию между всеми элементами.
Верхнее поле поля «Имя» и нижнее поле поля «Фамилия» не включены в высоту вложенного элемента div. Это правильно на мой взгляд.
Проблема:
Каким-то образом нижнее поле поля «Фамилия» включено в <li>. Я считаю, что этого не должно быть.
Также обратите внимание, что верхнее поле поля «Имя» не включено в высоту элемента <li> (что, я считаю, правильно). Как это может быть ???
PS:
Причина, по которой я не пытался изменить странную наценку, заключается в том, что я не могу. Я полагаю, что смогу, но это будет немного сложно, поэтому я останусь с изменением стилей.
Edit:
Я нашел основную причину моей проблемы:
Элемент LI является целью основного правила CSS clearfix, которое поставляется со стандартным CSS Magento. Селектор + правило, вызывающее проблему:
li:after {
content: ".";
}
Этот период, генерируемый CSS, предотвращает слияние полей внутренних DIV с полями братьев и сестер (других LI) их контейнера (LI). Поскольку период добавляется ПОСЛЕ LI, нижнее поле НЕ МОЖЕТ сработать, в то время как topmargin может и делает.