Click to See Complete Forum and Search --> : Center Page
romsok
09-22-2009, 03:35 PM
Hi,
I have a web page with a form with a border on top, and under it a table with data.
Is there a way in CSS to make sure that regardless of their size both the form and the table always appear in the middle of the browser window?
I.e. the space to the right of either one should be the same as the space to the left.
Thank you.
Benji6996
09-22-2009, 03:38 PM
give the table the property of:
margin: auto;
Unless I have misunderstood you, that should work.
aj_nsc
09-22-2009, 03:49 PM
This is assuming you mean 'center' instead of 'middle' - middle implies horizontally AND vertically centered (at least to me) which is a much trickier feat. Specifying margin: auto only works if the element is given an explicitly defined width.
romsok
09-22-2009, 04:04 PM
margin: auto; helped in my case.
Thanks a lot!
Benji6996
09-22-2009, 04:06 PM
Well what you are trying to do is possible but requires workarounds due to the fact that css does not offer vertical align for these elements.
There are several workarounds you can try:
The best way of doing it requires you to know the height of your element. Is there no way of you working this out?
A very poor way of doing it would be to create a 1 cell table with width 100%, text-align: center and vertical-align: middle;
There are likely to be some solutions around the web, do a search on google for vertical aligning a div.
Benji6996
09-22-2009, 04:09 PM
okay then forget what I have just posted. Hope all goes well