Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

div - centering

Status
Not open for further replies.
tomaustin

tomaustin

Programmer
May 24, 2004
30
0
0
GB
k, i have a container which holds all of my layout in it. I want to center it

Code: 
#container
{
width: 700;
align: center; 
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 130%;
}

why does the align: center tag not work

Im using ie6. I need it to be static width ie. 700px

can anyone help.

Its probly really simple

Thanks

TOm:)
 
Sort by date Sort by votes
First of all, make sure that non-zero values in your css have units. Any number that does not have units specified is at a mercy of browsers interpretation (except line-height). Also, there is no css attribute called align. Your syntax is good, but unfortunately IE is stupid. It does not understand the margin: auto. For IE to cooperate, you need to enclose it in another div and set text-align to center in that one. This won't bother other, standards compliant browsers:
Code: 
<style type="text/css">
#container
{
width: 700px;
/* align: center;  use text-align: center; if you want to center text within container */
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 130%;
}
</style>

<div style="text-align: center;">
 <div id="container"></div>
</div>
 
Upvote 0 Downvote
thanks so much

Really appreciate that

hmm..I been reading alot about IE not following compliance rules, thats just silly!

:)
 
Upvote 0 Downvote
hmm..its not happening. Its the same. ALigned left

I understand ur little fix u got going on.

I have to finished the div tags off after the rest of the stuff, will that make a difference?

When I finihed them where you did, it sent the whole layout absolutely crazy!!


Any more suggestions
:)
 
Upvote 0 Downvote
<div style="align: center;">
<div id="container">
<div id="top">
<h1>Comfort Zone - Recliners and Beds</h1>
</div>
<div id="leftnav">
<p>
LEft nav LEft nav LEft nav LEft nav LEft nav LEft nav LEft nav LEft nav
</p>
</div>
<div id="rightnav">
<p>
Right nav Right nav Right nav Right nav Right nav Right nav Right nav Right nav
</p>
</div>
<div id="content">
<h2>Content</h2>
<p>
Content Content Content Content Content Content Content Content Content Content Content Content
</p>
<p>
More content More content More content More content More content More content More content More content More content More content More content More content More content
</p>
</div>
<div id="footer">
Footer
</div>
</div>
</div>
</div>
 
Upvote 0 Downvote
It's hard to say without the corresponding stylesheets. On the outer div you are using style="align: center;". Once again, align does not exist in css, the property is called text-align. Try changing:

<div style="align: center;">

to

<div style="text-align: center;">

If it still messes up the display, post your css as well as html for us to inspect.
 
Upvote 0 Downvote
What is your DOCTYPE?

The following works well for me:
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

If IE goes into "quirks" mode, you can see very strange results.

Ken
 
Upvote 0 Downvote
sorry I been so long to reply

Thanks4 all your help. If I run into any more probs I'll post up the .css file

Cheers
tom:
 
Upvote 0 Downvote
small problem, I have got my div container to center using the suggested method of text align in another div. This works

Bur it centres my text in all divs. Can I stop/control this?

cheers
:)
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

tyutghf
  • Locked
  • Question
Slanted divs
Replies
0
Views
135
tyutghf
tyutghf
jason.lex
  • Locked
  • Question
crop image to fit in a div box?
Replies
2
Views
55
jason.lex
jason.lex
tyutghf
  • Locked
  • Question
Hide div on input focus
Replies
2
Views
44
tyutghf
tyutghf
Krus1972
  • Locked
  • Question
Centering Content Within a Fixed Navigation Menu
Replies
10
Views
107
ChrisHirst
ChrisHirst
kurio71
  • Locked
  • Question
Centre a DIV Regardless of Screen Size 2
Replies
7
Views
78
ChrisHirst
ChrisHirst

Part and Inventory Search

Sponsor

Back
Top