Centering a fixed with Div in the browser.

[CES]

All,

I'm sorry for the 2nd stupid question but... I'm trying to fix all of the issues I've had in the past. In the past I've resorted to using a table with the align attributed set to center as the container for the div that I want centered. As follows:

<table align="center">
<tr>
<td>
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</td>
</tr>
</table>

I've tried the following, with other variations, but while IE displays the div as I intended, Firefox does not center the div as intended it left aligns it.

<div style="text-align:center;">
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</div>

Any help on this would be greatly appreciated. Thanks in advance. - CES

[Greg Heilers]

CES wrote:

All,

I'm sorry for the 2nd stupid question but... I'm trying to fix all of the
issues I've had in the past. In the past I've resorted to using a table
with the align attributed set to center as the container for the div that
I want centered. As follows:

<table align="center">
<tr>
<td>
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</td>
</tr>
</table>

I've tried the following, with other variations, but while IE displays the
div as I intended, Firefox does not center the div as intended it left
aligns it.

<div style="text-align:center;">
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</div>

Any help on this would be greatly appreciated. Thanks in advance. - CES

This seems to work for me, though I will not vouch for the "political
correctness" of the method:
...............................
<div style="text-align:center;">
*****<div style="width:700px; background-color:blue;
margin-left:auto; margin-right:auto;">
*********TEXT*Goes*hear
*****</div>
</div>

--

Greg Heilers
Registered Linux user #328317 - SlackWare 10.1 (2.6.10)
.....

As far as anyone knows we're a nice, normal family.

-- Homer Simpson
There's No Disgrace Like Home

[Gérard Talbot]

CES a écrit :

All,

I'm sorry for the 2nd stupid question but... I'm trying to fix all of
the issues I've had in the past. In the past I've resorted to using a
table with the align attributed set to center as the container for the
div that I want centered. As follows:

<table align="center">
<tr>
<td>
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</td>
</tr>
</table>

I've tried the following, with other variations, but while IE displays
the div as I intended, Firefox does not center the div as intended it
left aligns it.

<div style="text-align:center;">
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</div>

As I understand what you are looking for (it's not clear), you want to
center the inline element, not center the block-level element within its
own container. I must say I'm not sure of what you want to center.

<div style="text-align:center; width:700px; background-color:
blue;">TEXT Goes hear</div>

Try this demo:

http://www.gtalbot.org/NvuSection/Nv...Alignment.html

Gérard
--
remove blah to email me

[Spartanicus]

CES <no**@none.com> wrote:

I've tried the following, with other variations, but while IE displays the div as I intended, Firefox does not center the div as intended it left aligns it.

http://dorward.me.uk/www/centre/

--
Spartanicus

[Tony]

"CES" <no**@none.com> wrote in message
news:4%*****************@news-wrt-01.rdc-nyc.rr.com...

All,

I'm sorry for the 2nd stupid question but... I'm trying to fix all of the
issues I've had in the past. In the past I've resorted to using a table
with the align attributed set to center as the container for the div that
I want centered. As follows:

<table align="center">
<tr>
<td>
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</td>
</tr>
</table>

I've tried the following, with other variations, but while IE displays the
div as I intended, Firefox does not center the div as intended it left
aligns it.

<div style="text-align:center;">
<div style="width:700px;background-color:Blue;">
TEXT Goes hear
</div>
</div>

Any help on this would be greatly appreciated. Thanks in advance. - CES

Read up on CSS a bit more - the answer is actually rather easy to find:

IE renders incorrectly and centers the DIV. A DIV is a block-level element,
and should not be centered by use of "text-align". Rather, you center a DIV
by adjusting the margins. Try:

<div style="text-align:center;"> <!-- Keep this here for IE -->
<div
style="width:700px;background-color:blue;margin-left:auto;margin-right:auto;">
Text goes here
</div>
</div>
Also, try a little more googling - and check out the CSS tutorial at
W3schools.com: http://www.w3schools.com/css/default.asp