HTML Table Placeholder Error

StackOverflow https://stackoverflow.com//questions/21059142

سؤال

Why my placeholder isnt in line ? and why it isnt showing full text?

http://jsfiddle.net/56mTX/

<body>
    <div>
        <form method="post" action="">
            <table border="1" width="200">
                <tr>
                    <th colspan="6" align="center"> <b>Mini Calculator</b>
                    </th>
                </tr>
                <tr>
                    <td Colspan="6">
                        <input id="txtvalueone" type="text" placeholder="Please Enter The First Value Here" />
                    </td>
                </tr>
                <tr>
                    <td Colspan="6">
                        <input id="txtvaluetwo" type="text" placeholder="Please Enter The Second Value Here" />
                    </td>
                </tr>
                <tr>
                    <td colspan="6">
                        <input id="txtresult" type="text" placeholder="Result Here" disabled/>
                    </td>
                    <tr>
                        <tr>
                            <TD>
                                <INPUT id="btnAdd" type="button" value="Add" onclick="txtresult.value = eval(parseFloat(txtvalueone.value) + parseFloat(txtvaluetwo.value))" />
                            </TD>
                            <TD>
                                <INPUT id="btnSubtract" type="button" value="Subtract" onclick="txtresult.value = eval(parseFloat(txtvalueone.value) - parseFloat(txtvaluetwo.value))" />
                            </TD>
                            <TD>
                                <INPUT id="btnMultiply" type="button" value="Multiply" onclick="txtresult.value = eval(parseFloat(txtvalueone.value) * parseFloat(txtvaluetwo.value))" />
                            </TD>
                            <TD>
                                <INPUT id="btnDivide" type="button" value="Divide" onclick="txtresult.value = eval(parseFloat(txtvalueone.value) / parseFloat(txtvaluetwo.value))" />
                            </TD>
                            <TD>
                                <INPUT id="btnreset" type="reset" value="Reset" />
                            </TD>
                        </tr>
            </TABLE>
        </FORM>
    </DIV>
</BODY>

Please Update It TO JSFiddlle if possible

هل كانت مفيدة؟

المحلول

it´s because the input haven't the appropriate size.

try this

http://jsfiddle.net/56mTX/2/

add the css for make it bigger, and it´s done 

input[type="text"]{
    width:100%;
    display:block;
}

نصائح أخرى

Try this

{
    display: block;
    width: 98%;
}

If you want to increase the size of your inputtextfield you need to mention the size of your input textfield like this size="30". If you increased the size then placeholder would appear fully on textfield

FIDDLE

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top