Click to See Complete Forum and Search --> : Wrapping Text in a Button


AndyL
05-15-2003, 09:55 AM
Hello,

I am using HTML generated buttons [for ease] and have tailored their text/background colour, width & height. The buttons in question appear in a 'navigational' frame down the left-hand side of the screen and I have defined a constant button width. I can amend the height [& width] of the buttons but so far cannot get 'longish' text in the buttons to wrap to fit the button - it just 'disappears' off the button. Therefore, is it possible to wrap text in HTML generated buttons?

Code to follow:
===============================================
<INPUT TYPE=button STYLE="width:8em; height:4em; background=#444488; color:#FFFFFF" TITLE="Home Page" VALUE="Exceedingly Long Text Value Which I Want To Wrap"
onMouseOver="window.status='Home Page'; return true"
onMouseOut="window.status=''; return true"
onClick="parent.mainarea.location.href='mainarea.php'; return false">
===============================================

Many thanks,
Andy

Vladdy
05-15-2003, 10:38 AM
Use <button> element instead of <input type="button">
http://www.w3.org/TR/html4/interact/forms.html#h-17.5

AndyL
05-15-2003, 11:13 AM
Hello,

Thanks for your reply.

I have looked at your link however cannot locate the attribute of the <BUTTON> tag which is going to allow me to modify the button [ie. wrap the text of the button].

To clarify; if I have a 'Submit' button in which the text is, for example 100 charcters long, how do i get the text inside the button to wrap around within the button, instead of it existing on just the one line?

Many thanks,
Andy

Vladdy
05-15-2003, 11:15 AM
Buttons created with the BUTTON element function just like buttons created with the INPUT element, but they offer richer rendering possibilities: the BUTTON element may have content.
That means you can do this:
<button>First line of text<br>Second line of text</button>

AndyL
05-16-2003, 07:19 AM
Thank you.
Kind regards,
Andy