Question

I have an issue with displaying the label value for the <h:commandButton>. For example, please see the below code

<td align="left"  style="float: left;">
            <h:commandButton value ="Reset Demand To Default"  styleClass="refresh-button-style" />
        </td>

I have created the styleclass for this button and the code for the styleclass is specified below.

.refresh-button-style
{
word-wrap: break-word !important;
background-color:#2996EF;
height:40px;
width:100px;
font-size:13px;
text-align: center;
font-family: Arial;
 }

When I try to run the xhtml file and disable the label value, The label value seems to get displayed horizontally. It does do the wordwrap and hence displays only part of the button label. Can you please let me know how to achieve the wordwrap for the button and display the entire label value within the command Button.

Answer 1

Try the following css attribute:

white-space:normal;

This should wrap the text as expected (source).