Div Layout

jwalker80 · #1 Dec 20th, 2005, 23:13

Hey, Im having a problem positioning some of my divs. See attached gif, What is the best way to position/float divs 4,5 and 6?

Pheonix · #2 Dec 20th, 2005, 23:16

put 1,4,5, and 6 all into one div.
Or postion your div's absolutely

herkalees · #3 Dec 21st, 2005, 01:17

using position: is the only way. For instance, 4 can be cleared left to get under one, because then it will get under 2... so using a combo of absolute and relative positioning will be the only way.

Pheonix · #4 Dec 21st, 2005, 03:37

Quote:

Originally Posted by herkalees

using position: is the only way. For instance, 4 can be cleared left to get under one, because then it will get under 2... so using a combo of absolute and relative positioning will be the only way.

Lies!

HTML: Select all

<div style="width: 900px;">
<div style="float:left;">
<div style="background-color: red; width: 361px; height: 128px;">background-color: red; width: 361px; height: 128px;</div>
<div style="background-color: yellow; width: 361px; height: 50px;">background-color: yellow; width: 361px; height: 50px;</div>
<div style="background-color: red; width: 181px; height: 163px; float: left;">background-color: red; width: 181px; height: 163px; float: left;</div>
<div style="background-color: green; width: 180px; height: 163px; float: left;">background-color: green; width: 180px; height: 163px; float: left;</div>
</div>
<div style="background-color: blue; width: 187; height: 341px; float: left;">background-color: blue; width: 187; height: 341; float: left;</div>
<div style="background-color: green; width: 352; height: 341px; float: left;">background-color: blue; width: 187; height: 341; float: left;</div>
</div>
<div style="background-color: yellow; width: 900px; clear: both;">background-color: yellow; width: 900px; clear: both;</div>

Done without any postioning at all...

herkalees · #5 Dec 21st, 2005, 03:42

You win

Pheonix · #6 Dec 21st, 2005, 03:43

I know ^_^
But the main problem with my code is it ends up being very inflexable very quick, which I don't like. So personaly I would still go with the rel/abs postioning method

jpmitchell · #7 Dec 21st, 2005, 14:19

Phoenix, what makes your code inflexible?

Pheonix · #8 Dec 21st, 2005, 17:48

I used something like it for another site I did, when I needed to make a change it quickly fell apart and I found useing absolute postioning much easier to update when I needed to make changes.

LinkBacks (?) LinkBack to this Thread: http://webforumz.com/web-page-design/4500-div-layout.htm
Posted By	For	Type	Date
Div Layout	This thread	Refback	Oct 22nd, 2006 04:16

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
CSS layout	casho	Web Page Design	4	Feb 10th, 2008 13:59
Layout using CSS	Madball	Web Page Design	5	Nov 7th, 2007 09:41
New to CSS Layout	tapster	Web Page Design	15	Oct 15th, 2007 10:18
Fluid layout - IE6 clichés the layout when resizing	cyberseed	Web Page Design	7	Jun 16th, 2007 05:14
What makes a layout a good layout?	Miles Lombardi	Graphics and 3D	4	Jul 26th, 2005 03:22

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
Div Layout