Как мне обернуть текст кнопки в Opera? - PullRequest
0 голосов
/ 26 марта 2012

Я почти создал сайт, который работает во всех основных браузерах без нареканий. Вчера я праздновал, потому что это было правдой. Сегодня я узнал, что это не так.

Очевидно, Opera не будет переносить текст на кнопки. Я перепробовал все, что появилось в моих поисках - от пробелов до устаревших хаков Mozilla Firefox.

Как я могу сказать Opera обернуть текст на кнопке? Укорочение текста не вариант, так как самое короткое может быть слишком длинным.

EDIT:

Вот JSFiddle: http://jsfiddle.net/JavaAndCSharp/grX4H/

Ответы [ 2 ]

1 голос
/ 26 марта 2012

Хм, да, это так?Я даже не сделал ничего, кроме определения ширины кнопки.Я бы предположил, что у вас конфликтующий CSS.

http://jsfiddle.net/Qgdzx/

HTML:

<button>This is really long button text that should wrap after I define a fixed-width.</button>

CSS:

button{
    width:60px;
}

Вывод:

enter image description here


Изменить после обновления http://jsfiddle.net/CJbae/

HTML:

<form>
    <button id="littleWorld" type="button">really really long text that will probably overflow on opera</button> 
</form>

CSS:

#littleWorld{
    border-radius:40px;
    border-width:0px;
    width:250px;
    height:250px; 
    background-color:#808080;
    font-family:Arial, Helvetica, sans-serif;
    font-size:11px;
    font-weight:bold;
    color:#FFFFFF; 
}

rounded button

0 голосов
/ 26 марта 2012

Это действительно известная проблема в Opera, где к элементам BUTTON будет применяться больше форматирования текста, чем к кнопке INPUT type =. На самом деле они должны быть эквивалентны.

Я надеюсь, что использование BUTTON вместо INPUT type = "button" - приемлемый обходной путь (скрестив пальцы - BUTTON может вызвать другие проблемы с рендерингом в других браузерах ..)

Кажется, в Opera уже есть ошибка - внутренне это CORE-45335.

...