CODEWITHSUNDEEP
htmlcssformshtml-table
kacpi2442
kacpi2442

Reputation: 23

How to center input of form in table? HTML

I want to put inputs in one row.

<table border='1' cellpadding="25" style='border-collapse: collapse;border-color: silver;'> 
<tr style='font-weight: bold;'>
<td width='350' align='center'>
<h2>Register:</h2><br>
Login: <input type="text" name="login" maxlength="20" size="25" /><br>
Password: <input type="password" name="password" size="25" maxlength="32" /><br>
Repeat password: <input type="password" name="password2" size="25" maxlength="32" /><br><br>
</td></tr></table>

Upvotes: 2

Views: 16942

Answers (3)

Krishna Chandran
Krishna Chandran

Reputation: 399

I think you are trying to get all this aligned in the center.For that we have to use the the "tr" tag defines a row in an HTML table and "th" tag which defines a header cell in an HTML table.Try the following code : 

<html>
<body>
<h2 align="center">Register</h2>
    <table align="center">
        <tr>
            <td>Login</td>      
            <td><input type="text" name="login" align="middle"/></td>
        </tr>
        <tr>
            <td>Password</td>
            <td><input type="password" name="pass" align="middle"/></td>
        </tr>
        <tr>
            <td>Repeat Password</td>
            <td><input type="password" name="rpass" align="middle"/></td>
        </tr>   

    </table>

Also we use the align property for table and the new rows we create to get what you desire.

Upvotes: 5

Mehdi Dehghani
Mehdi Dehghani

Reputation: 11601

I think you have 3 options:

  1. using CSS & position:relative and play with left' of eachinputs`, that's not valid at all.

  2. Add some more HTML, I mean put each inputs on separate td. this is the best choice I think, and even better that you put the label / text' of each input on another td as well.

  3. Using div (for example) instead of td for having more control and using CSS as well.

I strongly recommend you that using option #2, hope this help.

Upvotes: 0

waders group
waders group

Reputation: 538

Do it like that:

<table border='1' cellpadding="25" style='border-collapse: collapse;border-color: silver;'> 
<tr style='font-weight: bold;'>
<td style="width: 300px; text-align: right;">
Login: 
</td>
<td style="width: 300px; text-align: left;">
<input type="text" name="login" maxlength="20" size="25" />
</td>
</tr>

<tr style='font-weight: bold;'>
<td style="width: 300px; text-align: right;">
Password:
</td>
<td style="width: 300px; text-align: left;">
<input type="password" name="password" size="25" maxlength="32" />
</td>
</tr>
</table>

Upvotes: -1

Related Questions