I've made a menu and I can get the same results using absolute positioning and float:left, which should I use, I've heard that you should use float instead of absolute. It's a menu in the header section.

Without seeing your code I can only give a general answer which would be to use floats (remember to clear the floats).

 

Position: absolute takes the element out of the normal flow and as a general rule it's best to have the whole page elements in the flow so that they follow and relate to each other, which can help if a user increases text size which enlarges element heights.

Without seeing your code I can only give a general answer which would be to use floats (remember to clear the floats).

 

Position: absolute takes the element out of the normal flow and as a general rule it's best to have the whole page elements in the flow so that they follow and relate to each other, which can help if a user increases text size which enlarges element heights.

 

The menu is inside my header div, will it still need to be cleared afterwards or when I use floats in another div outside of the header will it still be using the same flow.

 

I've just read that you should use floats if elements interact with each other and absolute if they don't. Not sure if it's true or not?

The menu is inside my header div, will it still need to be cleared afterwards or when I use floats in another div outside of the header will it still be using the same flow.

 

You often need to clear the float even if the div with the float is inside a container div, if the floated div has more height than any other unfloated div inside the container. It's best to do it every time to be safe. If the div following your container with the floated div is full width, it's simplest just to put clear: both in that div's style. If the following div is not full width, you can find that the div following that one will jump up over it! Then it's best to use another method, either overflow: hidden in the container with the floated div, or insert an empty div with clear: both; width: 100%; after the floated div or use clearfix:after. See

http://www.wickham43.net/firefoxbackground.php

items 2b, 2c or 2d. There are other methods.

 

I've just read that you should use floats if elements interact with each other and absolute if they don't. Not sure if it's true or not?

I suppose that's basically true, but I would generally try to make elements interact with each other so that height can be flexible if someone increases text size and then divs will move to allow that to happen.

Edited June 30, 201115 yr by Wickham

You often need to clear the float even if the div with the float is inside a container div, if the floated div has more height than any other unfloated div inside the container. It's best to do it every time to be safe. If the div following your container with the floated div is full width, it's simplest just to put clear: both in that div's style. If the following div is not full width, you can find that the div following that one will jump up over it! Then it's best to use another method, either overflow: hidden in the container with the floated div, or insert an empty div with clear: both; width: 100%; after the floated div or use clearfix:after. See

http://www.wickham43.net/firefoxbackground.php

items 2b, 2c or 2d. There are other methods.

 

 

I suppose that's basically true, but I would generally try to make elements interact with each other so that height can be flexible if someone increases text size and then divs will move to allow that to happen.

Ok thanks for that, I'll have a play around. It sounds like with height settings its preferable to use 'min-height' instead of 'height'?