button отступы

Zippovich · June 18, 2009

Здравствуйте.

В IE убирается: overflow: visible

FF выставляет 3px отступ. Как убрать?

Игорь Ермаков · June 18, 2009

Какой ещё отступ?

Может по русски напишете и код приложите?

Отступы вообще-то убираются так:

margin:0px; padding:0px;

Zippovich · June 18, 2009

* {padding: 0; margin: 0}

XHTML 1.0 Strict

<button>
<div></div>
</button>

В FF между границами button и div 3px (по горизонтали)

Так понятно?

Edited June 18, 2009 by Zippovich

psywalker · June 18, 2009

слушай, а что за элемент такой: <button></button> ? Не слышал о таком

Zippovich · June 18, 2009

http://www.htmlbook.ru/html/button.html

psywalker · June 18, 2009

А почему нельзя использовать <input type="button" /> ?

Просто я никогда не пользуюсь твоим элементом, чем он лучше, и вообще кажется, что он некорректно может отображаться в ИЕ?

yopopt · June 18, 2009

button - строчный элемент. В него нельзя вкладывать блочные.

psywalker · June 18, 2009

yopopt

Извини друг, а объясни, чем он лучше <input type="button" /> ? Да и вообще в каких случаях его уместно использовать и почему?

Edited June 18, 2009 by psywalker

s0rr0w · June 18, 2009

Пока жив ИЕ, использовать button бесполезно.

Да и отмирают эти теги понемногу...

psywalker · June 18, 2009

Пока жив ИЕ, использовать button бесполезно.
Да и отмирают эти теги понемногу...

Да вот и я об этомже, пока ИЕ будет умирать - button уже вымрет

Edited June 18, 2009 by psywalker

s0rr0w · June 18, 2009

Да вот и я об этомже, пока ИЕ умрёт - button уже вымрет

Идея хорошая была, но на момент создания спецификации...

Zippovich · June 19, 2009

Мне надо сделать нефиксированную по длине кнопку (не ссылку), а именно кнопку, с закругленными углами.

На input type="button" я такого не налеплю.

s0rr0w · June 19, 2009

Мне надо сделать нефиксированную по длине кнопку (не ссылку), а именно кнопку, с закругленными углами.
На input type="button" я такого не налеплю.

Почему именно кнопку? Именно кнопка нужна?

Zippovich · June 19, 2009

Ну очень хотелось бы кнопку.

Я могу конечно пользовать this.submit(), но очень не хотелось бы.

Я делал раньше кроссброузерно на button такое, но раньше в кнопке не было такого сложного фона и поведения.

psywalker · June 19, 2009

Zippovich

слушай дружище, а покажи картинку того, что хочешь получить, может я смогу заморочиться, я люблю такие темы, попробую помочь хотяб

Zippovich · June 19, 2009

Вот, кнопка должна тянуться по горизонтали, в зависимости от контента

SelenIT · June 19, 2009

button - строчный элемент. В него нельзя вкладывать блочные.

Неправда.

Пока жив ИЕ, использовать button бесполезно.
Да и отмирают эти теги понемногу...

Если кнопка в форме одна — небесполезно. <button type="button"> — небесполезно. Откуда инфа об "отмирании"?

FF выставляет 3px отступ. Как убрать?

У меня более-менее получалось лишь отрицательными margin-ами специально для FF, через хаки. Да, здесь со стророны FF засада...

psywalker · June 19, 2009

так не пойдёт? http://psywalker.ru/Forum/button/ind.html

Если что в ИЕ6 нужно просто уменьшить марджины: div div div { margin: 0 3px;}

yopopt · June 19, 2009

Неправда.

Да, был не прав.

yopopt
Извини друг, а объясни, чем он лучше <input type="button" /> ? Да и вообще в каких случаях его уместно использовать и почему?

Я всегда использую <input type="button" />, поскольку ни разу не было ситуации, когда нужен был именно тег button.

SelenIT · June 19, 2009

Надо же, как бывает: когда самому было надо — в упор не видел, а как другие подняли тему — внезапно нашел решение (по ссылке на другом известном блоге

<!--
Обходной путь — задать "::-moz-focus-inner", чтобы получить padding и border в 0px.
Это скроет лишний padding, но также приведет к потере кнопкой ее выделения
при фокусе. Чтобы обойти это, укажите для "button:focus" наличие outline,
расположенного снаружи вокруг кнопки. Пример:
-->
<html>
<style type="text/css">
button {padding:0; border:0}
button::-moz-focus-inner {padding:0; border:0}
button:focus {outline: 1px dotted}

table {background:yellow; border:1px solid}
</style>
<button>
<table><tr><td>button1</td></tr></table>
</button>
</html>

чем он лучше <input type="button" />

Тем, что позволяет пихать внутрь произвольную разметку (кроме ссылок и др. эл-тов форм). Соответственно, можно сделать кнопку c текстом в несколько строк, можно выделить подчеркиванием хоткей для данной кнопки, можно без графики изобразить на кнопке несложную формулу...

Edited June 19, 2009 by SelenIT

AjiTae · June 19, 2009

так не пойдёт? http://psywalker.ru/Forum/button/ind.html
Если что в ИЕ6 нужно просто уменьшить марджины: div div div { margin: 0 3px;}

Один див лишний по-любому(бг можно и самой кнопке назначить), но чует моё сердце есть вариант красивее))

psywalker · June 19, 2009

AjiTae

я думал о кнопке, просто проблема ещё получилась в стрелочке,которая слева, на что её вешать?

Zippovich · June 22, 2009

SelenIT: огромное спасибо за решение.

Жалко что работу уже сдал с ссылками и навешанными на них onclick="document.getElementById('anounces-form').submit(); return false;" и пр.

Не люблю такие некрасивые решения.

Edited June 22, 2009 by Zippovich

Sign In

button отступы

Question

Link to comment

Share on other sites

22 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information