Page 1 of 1
CSS - Divs
Posted: Tue Mar 13, 2007 12:25 am
by iknownothing
Hey Guys,
Stupid question number 2 here I think (But I did Google it first). I have a bunch of divs, one div has the content area, and when it goes past its full standard length, it expands, but does not push any of the lower divs down, and it goes under them. All divs are set to "position: absolute" and it was generated by Photoshop CS2. So how do I set it, so that all lower divs, are responsive to height adjustments from divs above?
Posted: Tue Mar 13, 2007 1:28 am
by matthijs
Don't use position:absolute.
That will take each div out of the normal document flow, and just place it in it's position, without consideration of surrounding elements. So things start to overlap if you're not careful.
Just start with your markup inside the divs, with no styling. You'll see how everything flows nicely when you increase the text size for example. After that, you can start using floats if you want columns for example.
Posted: Tue Mar 13, 2007 1:45 am
by iknownothing
How can a variety of different sized divs fit side by side and beneath each other correctly without positioning. I took out the positioning, and there is about 10 divs going straight down the page?
Posted: Tue Mar 13, 2007 2:20 am
by matthijs
Use floats.
You could use positioning, but the problem with that is that it isn't scalable. You almost never know how much content a box will contain or how much space that content will take (if we're talking text). So you never know how much vertical space a box will take in someone's browser.
With floats, everything just flows in place and adjusts nicely to the content it contains.
If you don't know much about CSS yet though I would read some tutorials about the basics (floating, positioning, etc) first.
Posted: Tue Mar 13, 2007 3:59 am
by nickvd
Making flexible, cross browser and pixel perfect graphical layouts using css is very difficult to do easily and quickly. It's sometimes worth the time (and money) to just fall back to tables for the intricate layouts (or obscenely picky clients).
Posted: Tue Mar 13, 2007 8:02 am
by matthijs
nickvd is correct. If you don't know any/much CSS, but you do know how to make sites with tables and you have an impatient client waiting for his site: fall back to a table (or two). If you do have the chance to learn how to do it with CSS, it's worth your time. You'll have to take a few frustrating evenings debugging for granted then

Posted: Tue Mar 13, 2007 8:25 am
by CoderGoblin
Another "cheat" I use is to look out for free templates already on the web.
Open Source Web Design is one site I have used in the past.
You do not have to use the templates as they are you are free to modify them, but it gives you a good starting point.