Кнопка HTML с автоматическим изменением размера на основе текста без таблиц

<table align="center" cellpadding="0" cellspacing="0" border="0" height="32px">
    <tr>
        <td>
            <img src="http://img203.imageshack.us/img203/8052/lefto.png" border="0" />
        </td>
        <td style="background:url(http://img24.imageshack.us/img24/2825/centervw.png); background-repeat: repeat-x; color:#FFFFFF;">
            Press Me Press Me Press Me Press Me Press Me Press Me Press Me Press Me Press Me
        </td>
        <td>
            <img src="http://img23.imageshack.us/img23/4676/rightk.png" />
        </td>
    </tr>
</table>

У меня есть хорошая кнопка, которая автоматически меняет размер в зависимости от длины текста в среднем столбце таблицы, попробуйте здесь http://jsfiddle.net/QaFTc/2/

Мне нужно сделать то же самое, не используя таблицы и по центру.

Я пробовал, и я либо не центрируюсь, либо мне нужно указать ширину кнопки.


button html autoresize
person John Smith    schedule 09.10.2012    source источник
comment
Я не совсем уверен, что вам нужно. Если вам нужна только кнопка, вы можете использовать теги ‹a› или ‹input›, если вам нужно отправить форму. Затем вы можете стилизовать его с помощью CSS.   -  person intelis    schedule 09.10.2012
comment
Мне нужна кнопка, например, для меню навигации, которая выглядит лучше, чем кнопка ‹input type = ...›, и мне нужно, чтобы это было не изображение, а текст. поэтому я могу редактировать его без фотошопа, для этого мне нужно, чтобы он автоматически изменял размер фона текста до длины текста, как я показал на ссылке, вы нажали ссылку?   -  person John Smith    schedule 10.10.2012

Ответы (2)


arrow_upward
0
arrow_downward

Вот что у меня получилось: http://jsfiddle.net/nqGX8/

Никаких таблиц, только div. Вы можете использовать изображения вместо цветов.

person circusdei    schedule 09.10.2012
comment
Первый раз, когда я слышу о теге кнопки, мне снова нужно, чтобы он был по центру. - person John Smith; 10.10.2012
comment
Текст по центру? Или кнопка с центром в родительском элементе? - person circusdei; 10.10.2012
comment
Обернутый div (display: inline-block) и выравнивание текста: center; на теле. Вы можете центрировать его так же, как и текст, или даже встроить его в текст. jsfiddle.net/U5gCF - person circusdei; 10.10.2012
comment
gr8 Я хотел пойти с меньшим количеством тегов, но думаю, этого нет. - person John Smith; 10.10.2012
comment
Я пробовал много разных способов, и этот оказался наиболее последовательным по отображению и функциональности. - person circusdei; 10.10.2012

arrow_upward
0
arrow_downward

Я добавил кнопку, используя button и span модифицированный jsfiddle

person Anoop    schedule 09.10.2012
comment
Теперь, как вы центрируете его, поскольку моя ссылка находится в центре. - person John Smith; 10.10.2012
comment
Я изменил свой jsfiddle jsfiddle.net/QaFTc/7. Я использую центр выравнивания текста на родительской кнопке (перемещенная кнопка внутри div). - person Anoop; 10.10.2012
comment
Проблемы с тегом кнопки: было обнаружено потенциально опасное значение Request.Form, потому что IE6 отправляет html внутри кнопки, которая, в моем случае, содержит теги html. из stackoverflow.com/questions/1903453/ - person circusdei; 10.10.2012