css horizontal centering problem in html

Thad · Feb 24, 2007

page problem: index.html

Located at www.imagedgifts.html

The problem is centering(horizontally) the button and table. I've validated
the page in w3c for html and css. I've even html tidied it(hope I said that
right). For the life of me I cannot get the table and button centered
horizontally in foxfire. It works just fine in IE though. Any suggestions
would be appreciated.

Thanks.

=?ISO-8859-1?Q?G=E9rard_Talbot?= · Feb 24, 2007

Thad wrote :

page problem: index.html

Located at www.imagedgifts.html

Do you mean located at http://www.imagedgifts.com/ ?

The problem is centering(horizontally) the button and table. I've validated
the page in w3c for html and css.

Good! I would recommend you to use a strict DTD instead of transitional
since your page is new.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

I've even html tidied it(hope I said that

right).

I recommend HandCoder 0.3.4
http://fabiwan.kenobi.free.fr/HandCoder/

and to get the latest Tidy at
http://dev.int64.org/tidy.html

Tidy Quick Reference:
http://tidy.sourceforge.net/docs/quickref.html

For the life of me I cannot get the table and button centered
horizontally in foxfire.

foxfire ? Do you mean Firefox ?

It works just fine in IE though. Any suggestions
would be appreciated.

Solution:

#tbl1, #a1 {margin-left: auto; margin-right: auto;}

More info:

Interactive demo on CSS horizontal alignment and horizontal formating
(when to use margin-left, margin-right and when to use text-align):
http://www.gtalbot.org/NvuSection/NvuWebDesignTips/HorizontalAlignment.html

Reference: CSS 1 horizontal formating (margin property) says: "if both
'margin-left' and 'margin-right' are 'auto', they will be set to equal
values. This will center the element inside its parent."

Reference: CSS 1 text-align property says: "The [text-align] property
describes how text (and inline elements) is aligned within the element."

Using Web Standards in your webpages
Section 2.2.3.2: I use <center> or align="center". How to align with CSS?
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_Pages

Also
Centring using CSS by D. Dorward
http://dorward.me.uk/www/centre/

Gérard

Thad · Feb 24, 2007

Thad wrote :

Do you mean located at http://www.imagedgifts.com/ ?

Didn't know there was a differance, but buy all good intentions, I did mean
http://www.imagedgifts.com/ . Good point.

Good! I would recommend you to use a strict DTD instead of transitional
since your page is new.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

I will take that into consideration. tyvm

foxfire ? Do you mean Firefox ?

Yes...I shall just start abreviating as FF so I don't make the same mistake
later. tyvm

Solution:

#tbl1, #a1 {margin-left: auto; margin-right: auto;}

From what I've read, I must have been daydreaming through those
sections...thanks for pointing that out.

Hey Gerald, your help is greatly appreciated.

Thad

Centering picture element for larger screen sizes	2	Sep 21, 2023
Horizontal scrollable table that is responsive	11	Jan 14, 2023
Chrome not displaying uploaded HTML and CSS code	5	Nov 17, 2022
CSS Text Centering Problem	4	Sep 17, 2007
problem centering element, using css	1	Mar 3, 2009
Simple Block Centering in IE	10	Nov 24, 2008
Centering problem in IE	2	Feb 28, 2006
Centering left-floated items - how? Please help!	2	Dec 5, 2006

css horizontal centering problem in html

Thad

=?ISO-8859-1?Q?G=E9rard_Talbot?=

Thad

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads