Версия для печати темы

Нажмите сюда для просмотра этой темы в обычном формате

Форум веб-мастеров _ Языки разметки (HTML, XML, CSS, ...) и JavaScript _ Как изменить ширину и высоту Reset и Submit (Opera)

Автор: Tamerlan 26.3.2008, 0:46

Доброго времени суток.
В таблице стилей все padding и margin выставил в ноль по умолчанию.
После этого кнопки Submit и Reset в Opera приняли ширину и высоту введенного в них текста, что выглядит не очень красиво.
Проверил в IE 6.0 - все осталось как было до обнуления.
Вопрос - как задать высоту и ширину для указанных кнопок?

Спасибо за ответы.

Автор: gid 26.3.2008, 13:17

Если я все правильно понял, то все можно решить теми же стилями. К примеру: добавьте к нужным кнопкам атрибут style, который содержит заданную высоту и ширину кнопки:

Код
<input type="Submit" style="width:200px;height:80px;">

Автор: Tamerlan 26.3.2008, 18:14

Спасибо!
Да, подсказанным вами способом удалось решить вопрос.

А как быть, если нужно прописать ширину и высоту для данных кнопок на 50-ти страницах?
Можно ли определить размеры один раз в таблице стилей, чтобы не прописывать на каждой странице?

Автор: gid 26.3.2008, 18:52

Можно, но только по отношению ко всем элементам типа input (не только к кнопкам). Для этого нужно в css-файл добавить:

Код
input {
width:200px;
height:80px;
}

Автор: Tamerlan 26.3.2008, 22:14

gid, спасибо.
Да, если один раз всего необходимо указать в таблице стилей, то указанный вами вариант идеален.

И интересный ответ был получен вне форума: но тут придеться определять класс для каждого элемента Submit и Reset на каждой странице.
Это для тех, у кого тоже может возникнуть такая ситуация в будущем.

Код
.button {width:100px; height:25px;}


И потом данный класс указывать для каждого указанного элемента.

Автор: gid 26.3.2008, 22:24

Называть класс .button можно как угодно, главное его потом правильно использовать... можно еще использовать не классы а идентификаторы для подобных вещей, т.е.:
CSS:

Код

/* класс */
.but  {
width:200px;
height:80px;
}

/* идентификатор  (id)*/
#but   {
width:200px;
height:80px;
}


HTML:
Код

Кнопка использующая класс:
<input type="Submit" class="but">
<br><br>
Кнопка использующая идентификатор:
<input type="Submit" id="but">

Автор: Tamerlan 27.3.2008, 18:31

Спасибо за подробный комментарий.
Уверен, начинающим это во многом поможет.

Invision Power Board ()
© Invision Power Services ()