2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
||||||
1 | ||||||
Равная высота поля и кнопки и кроссбраузерность08.02.2013, 10:49. Показов 5117. Ответов 18
Метки нет Все метки)
(
Господа, я тут несколько дней мучаюсь и не могу сделать поле и кнопку одинаковой высоты, чтобы текст внутри и само поле с кнопкой были выровнен. Хе-хе, думаете это просто? Это не просто! Ведь нужно чтобы было кроссбраузерно, а именно:
IE 5,5 (важно!) IE 6 (важно!) IE 7 IE 8 IE 9 Chrome Safari Firefox Opera
0
|
08.02.2013, 10:49 | |
Ответы с готовыми решениями:
18
Высота блока равная размеру фоновой картинки блока Высота поля со списком Высота кнопки другая в firefox-е |
![]() 632 / 440 / 67
Регистрация: 19.09.2012
Сообщений: 1,632
|
|
08.02.2013, 11:01 | 2 |
line-height поставить равным высоте кнопки ,если уберете вертикальные padding для кнопок.
1
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 11:28 [ТС] | 3 |
Не катит!
![]() Я уже не знаю что делать Добавлено через 16 минут Вся проблемма из-за IE 5.5 и IE 6. Если я сделаю так, чтобы корректно отображалось во всех браузерах, то в IE 5.5 и IE 6 отображается иначе.
0
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 13:51 [ТС] | 5 |
Блин, при чём тут только выравнивание текста!?
Тут вопрос не только в этом. Комплекс тут! Вот вы сами попробуйте и посмотрите что у вас получится. Было бы так всё просто, то я не стал обращаться за помощью ![]() Я уже несколько дней мучаюсь и не могу сделать одинаковой высоты поле и кнопку и чтобы они сами были выровнены и текст внутри тоже. В общем так, как на рисунке я вам показал. Попробуйте сделать, если интересно. Может у кого-то и получится. Я уже что только не пробовал и не получается у меня. Я уже и кучу фреймворков пересмотрел с образцами разных форм и кнопочек - и у всех них косячные input, у всех что-то да криво.
0
|
![]() 10 / 10 / 0
Регистрация: 30.01.2013
Сообщений: 93
|
|
08.02.2013, 14:37 | 6 |
просмотрел код у себя во всех браузерах все ровно даже в разных версиях только в мазиле чуток кнопка выше на пару пиксилей
может быть сделать один блок и в нем сделать еше 2-а блока один поле для вода текста другой кнопка, так расползаться небудет
1
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 15:07 [ТС] | 7 |
В 5.5 смотрел?
Так вся суть в 1 и 2 пикселях. Даже скорее в 1. То кнопка выше на пиксель. То высота на 1 пиксель меньше, то ещё чего. Об этом и речь. Вы что думаете, что проблема в 3-10 пикселях!? ![]() Только в одном! Вот я и говорю, как сделать всё одной высоты и выравнено?
0
|
странник
![]() |
|||||||||||
08.02.2013, 15:15 | 8 | ||||||||||
сделай кнопку не через input, а через div, придав ему соответствующий стиль, чтобы выглядел так же.
1
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 15:19 [ТС] | 9 |
Вообще-то интересно именно через просто input.
Через картинку вообще не подходит. И button тоже не катит. ![]()
0
|
странник
![]() |
|
08.02.2013, 15:23 | 10 |
Если через submit - то не уверен, что проблема кроссбраузерности разрешима в указанных браузерах (тем более для 5 осла).
Почему? У submit и image - одинаковая функция: при нажатии отправлять форму.
1
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 15:32 [ТС] | 11 |
Осёл не 5, а 5.5.
Картинка не подходит для резиновой, респонсивной, адаптивной вёрстки.
0
|
Почетный модератор
|
|
08.02.2013, 15:38 | 12 |
все остальное - аналогично. комплекс тут)
с паддингами всегда будет проблема не в одном, так в другом браузере. http://rotorweb.ru/htmlcss-ver... ormax.html
1
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 15:49 [ТС] | 13 |
Нету никакого паддинга у меня.
Задаю высоту допустим в пикселях, так получается - кнопка включая бордер = 24 пикселя, а поле 24 пикселя + бордер = 26 пикселей. А в старом Осле всё нормально.
0
|
08.02.2013, 15:53 | 14 |
Не по теме: там написано IE 5.5 ???? :swoon:
0
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 16:05 [ТС] | 16 |
Это вообще не подходит.
Если убрать height, то в 5.5 поле вообще будет низкое.
0
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 16:10 [ТС] | 17 |
Уважаемые господа.
Можно вас попросить реальное решение дать? Вы тут всякие советы даёте, но вы хоть сами сначала посмотрите что выйдет, если применить ваш совет.
0
|
![]() 13210 / 6599 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
|
||||||
08.02.2013, 16:22 | 18 | |||||
Дерек, Не у всех есть винда. Тем более с такими динозаврами в рабочем состоянии.
Добавлено через 1 минуту Дерек, См. также условные комментарии MS. http://msdn.microsoft.com/en-u... S.85).aspx Добавлено через 2 минуты
2
|
2 / 2 / 0
Регистрация: 08.02.2013
Сообщений: 30
|
|
08.02.2013, 16:29 [ТС] | 19 |
Вы имеете в виду, что нужно использовать дополнительные стили с хаками.
Может это действительно единственное решение. Кстати, у меня тоже нет старых Виндов отдельно на компе. Но есть тестер с пакетом Виндов.
0
|
08.02.2013, 16:29 | |
Помогаю со студенческими работами здесь
19
Цвет кнопки и кроссбраузерность Высота поля Edit Создать класс Сарай, имеющий поля: высота, ширина, глубина Отправка содержимого поля в файл при нажатии кнопки без потери этого содержимого с поля Создайте класс Конус, определите в нем закрытые поля Радиус, Высота, Образующая, свойства для этих полей Искать еще темы с ответами Или воспользуйтесь поиском по форуму: |
|
Новые блоги и статьи
![]() |
||||
Java Micronaut в Docker: контейнеризация с Maven и Jib
Javaican 16.03.2025
Когда речь заходит о микросервисной архитектуре на Java, фреймворк Micronaut выделяется среди конкурентов. Он создан с учётом особенностей облачных сред и контейнеров, что делает его идеальным. . .
|
Управление зависимостями в Java: Сравнение Spring, Guice и Dagger 2
Javaican 16.03.2025
Инъекция зависимостей (Dependency Injection, DI) — один из фундаментальных паттернов проектирования, который радикально меняет подход к созданию гибких и тестируемых Java-приложений. Суть этого. . .
|
Apache Airflow для оркестрации и автоматизации рабочих процессов
Mr. Docker 16.03.2025
Управление сложными рабочими процессами — одна из главных головных болей инженеров данных и DevOps-специалистов. Представьте себе: каждый день нужно запускать десятки скриптов в определенной. . .
|
Оптимизация приложений Java для ARM
Javaican 16.03.2025
ARM-архитектура переживает настоящий бум популярности в технологическом мире. Когда-то воспринимаемая исключительно как решение для мобильных устройств и встраиваемых систем, сегодня она штурмует. . .
|
Управление состоянием в Vue 3 с Pinia и Composition API
Reangularity 16.03.2025
Когда я начал работать с Vue несколько лет назад, мне казалось достаточным использовать простую передачу данных через props и события между компонентами. Однако уже на среднем по сложности проекте. . .
|
Введение в DevSecOps: основные принципы и инструменты
Mr. Docker 16.03.2025
DevSecOps - это подход к разработке программного обеспечения, который объединяет в себе принципы разработки (Dev), безопасности (Sec) и эксплуатации (Ops). Суть подхода заключается в том, чтобы. . .
|
GitHub Actions vs Jenkins: Сравнение инструментов CI/CD
Mr. Docker 16.03.2025
В этой битве за эффективность и скорость выпуска программных продуктов ключевую роль играют специализированные инструменты. Два гиганта в этой области — GitHub Actions и Jenkins — предлагают разные. . .
|
Реактивное программирование с Kafka Stream и Spring WebFlux
Javaican 16.03.2025
Реактивное программирование – это программная парадигма, ориентированная на потоки данных и распространение изменений. Она позволяет выражать статические или динамические потоки данных и. . .
|
Простая нейросеть на КуМир: Учебное пособие по созданию и обучению нейронных сетей
EggHead 16.03.2025
Искусственные нейронные сети — удивительная технология, позволяющая компьютерам имитировать работу человеческого мозга. Если вы хотя бы немного интересуетесь современными технологиями, то наверняка. . .
|
Исполнитель Кузнечик в КуМир: Решение задач
EggHead 16.03.2025
Среди множества исполнителей в системе КуМир особое место занимает Кузнечик — простой, но невероятно полезный виртуальный персонаж, который перемещается по числовой прямой, выполняя ваши команды. На. . .
|