Search code examples
htmlbuttonautoresize

HTML button that automatically resize based on text without tables


<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>

I have nice button that auto re-sizes based on length of text in middle table column try it here http://jsfiddle.net/QaFTc/2/

What i need is to do same without using tables and centered.

I tried and i either get not centered or i have to specify the width of button.


Solution

  • This is what i got: http://jsfiddle.net/nqGX8/

    No tables, divs only. You can use images instead of the colors.