view on http://www.eveo.org
download site for easy modification:
http://www.eveo.org/backup/eveo.rar
http://www.eveo.org/backup/eveo.zip
As you can see right now, it is centered horizontally and vertically using an easy table method:
<table cellpadding="0" cellspacing="0">
<tr>
<td align="left">
*put anything in here and it will be aligned horizontally and vertically
</td>
</tr>
</table>
accompanying CSS:
table
{
height: 100%;
width: 100%;
vertical-align: middle;
}
However, in my document I did not set a doctype, I only have:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
If I add a standard doctype such as the following:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
my table method is no longer valid and does not work. So I need a new way to center my webpage vertically and horizontally regardless of browser window size.
There are some cross-browser solutions that don't require Javascript or hacking.
One good example is here
Have a look also on this one.
For some learning, check this excellent example of gtalbot about horizonal align in CSS.
good luck >)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With