Topic: Float a left box... float a right box Pages that link to <a href="https://ozoneasylum.com/backlink?for=11174" title="Pages that link to Topic: Float a left box... float a right box" rel="nofollow" >Topic: Float a left box... float a right box\

 
Author Thread
Karl
Bipolar (III) Inmate

From: Phoenix
Insane since: Jul 2001

IP logged posted posted 03-18-2004 06:29 Edit Quote

Hi,

I am trying to achieve 2 columns. I am floating the left column and easily the right column appears. However, I do not want the right column to *eventualy* wrap... I want the left column no matter how tall or short the left column to create a boundary for the stuff on the content on the right. I didn't say that very well, but do you understand what I'm after?

Karl

Karl
Bipolar (III) Inmate

From: Phoenix
Insane since: Jul 2001

IP logged posted posted 03-18-2004 07:08 Edit Quote

I looked at the absolute positioning method: http://positioniseverything.net/thr.col.stretch.html
The problem I have with this, is that this sort of positioning does not cause a parenet element to stretch... my two columns are within a <div> block. This block has a background color... the entire page has a vertical repeating image. So the idea is... the 2 columns stretch a white background parent element...

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 03-18-2004 14:54 Edit Quote

float them both left.

you will then need to add a block level element after the floats with a "clear:both;" to force the wrapper to expand around them.



Scott
Bipolar (III) Inmate

From: schillmania.com
Insane since: Jul 2002

IP logged posted posted 03-18-2004 16:27 Edit Quote

As a side-note, the reasoning for that is explained at PIE as well. http://positioniseverything.net/articles/float-theory.html

And also, some float-related bugs you might run into (IE-specific): http://positioniseverything.net/articles/float-bugs-1.html

That site is a great float reference!

Karl
Bipolar (III) Inmate

From: Phoenix
Insane since: Jul 2001

IP logged posted posted 03-18-2004 16:56 Edit Quote

While we are on the subject (and thanks for previous.. worked great):

Lets say I wanted a 1px solid border down the middle of these two element that are floating next to each other... the border always need to extend the length of the longest column (which is an unknown)... any tips there? possibly a 3rd column stuck between the two?

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

IP logged posted posted 03-18-2004 18:19 Edit Quote

Paul's great work here - http://development.gurusnetwork.com/discussion/thread/2412/

Should provide some solutions for that.





Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu