My div(s) don't move when using margin

[kvnwpts]

Nice, would it be a good idea to “learn” all of these CSS properties? http://www.htmldog.com/reference/cssproperties/

@RyanReese

When you use overflow:hidden, a new block formatting context is created. A few properties do it, but this one will basically do nothing else to affect the rest of the element, it’s safe :). For example, display (a few values in there), floating, and position (absolute/fixed). As you see, all those will do a good bit of “damage”

It basically will ensure that the top margin that is set, is contained within the element, when you set overflow:hidden; on it.

Overflow is a wonderful property :).

[RyanReese]

Honestly you can if you want, and you really should know all of them at some point (though most of them are worthless, and you won’t use really at all. Take a look at them though)

A lot of those (such as background-attachment, background-repeat) can all be shortened into a shorthand property, and for that example, it is “background:”

I wouldn’t study CSS that way. Just view forum threads, check out their code, read the replies by the gurus here who know what they are talking about. You will learn :).

Note, I’m not saying you CAN’T learn that way, via learning them one at a time…however, it won’t tell you about bugs that apply to browsers, what each value can do, aka I doubt much is mentioned in that HTMLdog link about the powers of overflow:hidden(or any value there.

[dresden_phoenix]

Ryan pretty much explained it as I would have. DO NOTE that this is a side effect of the “overflow:” property. For that reason:

Nice, would it be a good idea to “learn” all of these CSS properties?
So it’s good to learn about all the properties but it BEST to have and exploitative thinking style. Remember that these properties INTERACT… so merely memorizing definitions wont be that useful.

[Stomme_poes]

I had thought it was margin-collapse but on the original code it was also that there were floats above it and the upper margin was sliding up under the floats, and that’s why I didn’t use the common margin-collapse solution (1px padding on container).

Kevin: I do generally try to use top-padding on the container rather than top-margin on the child for this reason, but sometimes you don’t want to do that (maybe the child has a background-color or border that you don’t want spacing on) and in those cases yes, you can use the 1px top padding (or border… there are a few triggers) on the container and that lets your child have a non-collapsed top-margin. Really, I don’t understand the person who came up with this, why did they think it was a good idea?

search-this.com

Re learning: The structure of the two books I got started with helped a lot. After that, it was a combination of building things, getting bugs, and reading/learning things like at HTMLdog etc. Forum posts as Ryan said are also good, especially if you read threads where someone has a problem you understand, and someone else then answers what’s wrong and why and how to fix. You might want to read deathshadow60’s posts, just ignore the ranting parts and read his code

[kvnwpts]

You guys gotta be right, I think I’ll learn long along the way as you said.

I think its pretty wierd too.

@dresden_phoenix

Ryan pretty much explained it as I would have. DO NOTE that this is a side effect of the “overflow:” property. For that reason: So it’s good to learn about all the properties but it BEST to have and exploitative thinking style. Remember that these properties INTERACT… so merely memorizing definitions wont be that useful.

@Stomme_poes

I had thought it was margin-collapse but on the original code it was also that there were floats above it and the upper margin was sliding up under the floats, and that’s why I didn’t use the common margin-collapse solution (1px padding on container).

Kevin: I do generally try to use top-padding on the container rather than top-margin on the child for this reason, but sometimes you don’t want to do that (maybe the child has a background-color or border that you don’t want spacing on) and in those cases yes, you can use the 1px top padding (or border… there are a few triggers) on the container and that lets your child have a non-collapsed top-margin. Really, I don’t understand the person who came up with this, why did they think it was a good idea?
http://www.search-this.com/2007/05/07/wheres-my-margin-gone-or-why-111/

Re learning: The structure of the two books I got started with helped a lot. After that, it was a combination of building things, getting bugs, and reading/learning things like at HTMLdog etc. Forum posts as Ryan said are also good, especially if you read threads where someone has a problem you understand, and someone else then answers what’s wrong and why and how to fix. You might want to read deathshadow60’s posts, just ignore the ranting parts and read his code