Не удается определить стили кнопок форм темы Zen
Здравствуйте. Сейчас темизирую сайт на основе темы Zen. В общем, проблема в следующем. В теме Zen (или даже в CSS-файлах самого Drupal'а) есть кнопки форм, выглядят они следующим образом:
А так она выглядит когда она в состоянии hover:
Вопрос: где находятся эти стили? Firebug не находит ничего существенного, как-то: картинка при наведении указателя, border, какого он цвета и т.д. По блочной модели видно border: 3px, padding: 0 6px; Но этого крайне мало, что бы сделать кнопки для других элементов сайта такими же. Могу догадываться, что стили этих кнопок изначально из форм самого HTML (основы знаю, но учил давно, и ничего по поводу кнопок вроде бы не проскакивало). На глаз гадать не хочется и выгадывать при помощи своих стилей. Буду рад советам и подсказкам.
Вот так можно в firebug'e посмотреть стили на hover:
Спасибо, но я как раз и смотрел таким образом. Конкретно при hover, да и вообще о блочной модели практически ничего нет. Могу скрин выложить. Если вы видите эти стили у себя, не могли бы вы предоставить скрин со стилями? И в состоянии hover и просто, с border, padding, margin, откуда берется фоновое изображение. Я у себя в теме такого даже не нашел, оно с градиентом. Буду очень признателен.
Скорее всего дело вот в этом css коде:
a.button {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
}
В zen 5.1 это файл
starterkit/css/forms.css
В разных браузерах это будет выглядеть по разному и другого css не будет видно.
спасибо, вчера ковырялся в поисках "CSS по умолчанию" для кнопок. Там в Firebug, где дополнительные галки на hover, active и focus, есть еще и галка "Показывать CSS браузера". Включив ее я многое увидал. Используется forms.css самого Firefox. В общем, посмотрев тот код, я решил сделать свои стили кнопок, но вот вылезла следующая проблема. Уточню, что я темизирую input'ы, ну и уже для общего стиля select'ы. Сделал предварительный вариант. В Firefox все выглядит отлично, в Chrome - разная высота этих же кнопок и выпадающих списков. Уже не знаю что и делать. В гугле искал по этому поводу - узнал, что это старая проблема, кроссбраузерная несовместимость отображения этих элементов. Как теперь мне привести все к одному виду даже и не знаю. Проблема даже не в том, как я видел в результатах поиска, что надписи не на одном уровне в разных браузерах, а в том, что визуально кнопки по высоте разные. Уже и так, и сяк пробовал. Не посоветуете "лекарство" от этой проблемы?
Нужно использовать jquery плагин какой-нибудь, например sexy uniform:
http://uniformjs.com/
спасибо, скачал - посмотрю.