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!

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

What does auto refer to in this code? 3

Status
Not open for further replies.

okpeery

Instructor
Dec 29, 2005
102
US
Code:
div#container{width:650px;margin: 0 auto;text-align:left}

If I get rid of it, my 2 containers move over toward the left side of the page where I want them to be. If I keep it it stays more in the center, I can live with it if I have to. I am fine tuning some code I got in a tutorial and can't figure out what this is.

I'll show the whole code if it is needed.

Disregard my earlier posts, this new design makes the things I was asking earlier unnecessary.
 
As you have figured out by observing, the code centers your container. Of course it depends on what you want whether you should use it or not. But here is an explanation of what is it.

Margin is a shorthand property that describes all 4 margins of the element. If there's one value there it refers to all margins. If there are two values, the first refers to top and bottom margins and the second one refers to left and right margins. So in your code you're setting left and right margins to auto. That means that with a fixed width of the elements, browser should automatically distribute space on the left and right of the container equally to both sides. That makes the container lie in the center.

Hope that makes it clear.
 
It's worth noting that this doesn't work in IE 5.0, and possibly not in IE 5.5. For these browsers, you can use "text-align:center" on an outer container, and set it back to "left" (as you are doing) to cancel this out on the centred container.

Dan



[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
This container is my outer-most container. The css for the body part however, is set to text align center, then inside the container is set to text align left. I wondered about that too, is this the work around you are talking about?

This is 2 floating divs, on the left side a small div for navigation and the larger one on the right side is for content. If I delete the auto part it moves left which I like. Should I replace auto with left so it always goes left or just remove auto? Will this cause other unforseen problems?
 
Yes, the text centering you're talking about is the workaround Dan mentioned. It is really hard for us to advise you on best practice with knowing just tiny bits of your code. If you provide us with the full code we can tell you what to add and what to omit.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top