Javascript set button width depending on the length of Text value

[ismailc]

Good day,

I have button with no width specified.
The text value of the button differs, so i left it with no width.

It automatically sets the width but the problem is it to wide with about 5 spaces on each side of text letting the button look stupid.

I thought of working out the Text in a javascript function then set the length of the button.

<input id="{Description}" type="button" value="{Description}" onClick="{@name}.click();" style="background-color: #f9f9f9; height: 23px;"></input>
 

Please help

[Dormilich]

The text value of the button differs, so i left it with no width.

erm, but you explicitly set a width …

additionally, HTML input elements should always be empty: <input … type="button">

[acoder]

Check the default padding for the button.

[Dormilich]

you may also use the <button> element, if you like.

[xNephilimx]

same as acoder, the problem is the padding for sure, a button will always accommodate it's with according to the text, unless you specify a fixed size. You have to be careful about the box model though, in mozila/webkit compatible browsers the padding (and border) is not taken in account in the width, so if the width is 10 and the padding (left and right) is 5 the with will still be 10px but you will see it as if it is 20px wide.
http://www.w3.org/TR/CSS21/box.html

[ismailc]

Thank You All :)

Got it going - i'm surpirsed no javascript needed.

overflow: visible;padding: 2px 2px 2px 2px;