469,304 Members | 2,192 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,304 developers. It's quick & easy.

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
Nov 23 '05 #1
4 1508
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

Nov 23 '05 #2
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
Nov 23 '05 #3
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
Nov 23 '05 #4
"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
Nov 23 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

1 post views Thread by Ron Bott | last post: by
3 posts views Thread by Wayfarer | last post: by
6 posts views Thread by Axel Siebenwirth | last post: by
3 posts views Thread by Robert Latest | last post: by
3 posts views Thread by John Pote | last post: by
5 posts views Thread by Markus Ernst | last post: by
18 posts views Thread by prophet | last post: by
1 post views Thread by =?Utf-8?B?ZnJhbmt5?= | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by harlem98 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.