How do I center this form so it stays centered when I adjust the size of my browser window?
<form>
First name:
<input type="text" name="firstname" />
<br />
Last name:
<input type="text" name="lastname" />
</form>
Thank-you.
How do I center this form so it stays centered when I adjust the size of my browser window?
<form>
First name:
<input type="text" name="firstname" />
<br />
Last name:
<input type="text" name="lastname" />
</form>
Thank-you.
Here's what I did and it works.
<style type="text/css">
div {text-align:right}
</style>
<div>
<table cellpadding="5">
<form>
First name:
<input type="text" name="firstname" />
<br />
Last name:
<input type="text" name="lastname" />
</form>
</table>
</div>
good job! but where is your 4?
Using margin 'auto' property can stay element in center. Don't use 'text-align' property to center the element. 'text-align' is only for text, not the element. You may also use like
CSS:
p {
text-align: center
}
HTML:
<p>This text will go to center</p>
Or use table cell align attribute. <td align="center">Align center cell</td>
In your process. You could also use.
div {
margin: 0 auto;
width: 400px /* auto margin can only apply with exceed width, if not it will ignore it */
}
I hope it will a little support for you.
Using margin 'auto' property can stay element in center. Don't use 'text-align' property to center the element. 'text-align' is only for text, not the element. You may also use like
CSS:
p {
text-align: center
}
HTML:
<p>This text will go to center</p>
Or use table cell align attribute.
<td align="center">Align center cell</td>
In your process. You could also use.
div {
margin: 0 auto;
width: 400px /* auto margin can only apply with exceed width, if not it will ignore it */
}
I hope it will a little support for you.
simple. just wrap it with a div tag
<div id="wrap">
1.
<form>
2.
First name:
3.
<input type="text" name="firstname" />
4.
<br />
5.
Last name:
6.
<input type="text" name="lastname" />
7.
</form>
</div>
and insert this in css
#wrap{
width: (width of form)px;
margin: auto;
}
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.