On 4/11/2009, at 11:10 AM, Yazmin Media wrote:

> Hi,
>
> I'm working on a 4 column layout that I found at pagecolumn.com. My
> issue is with the 4th column. I currently have a set width on it, but
> need to allow it to expand based on the content in the column (for ad
> purposes...serving both 160px and 300px ads). In the process, I would
> like for it to expand the header and footer in the same amount so that
> the right side of the design ends in the same spot.
>
> I'm not sure that I'm looking at the right information or even looking
> at this code in the right frame of mind, but I believed that this
> wasn't possible because the methods we have right now to create 4
> column designs all deal with floating divs, which then pulls them out
> of the flow of the document making it as if the div wasn't there at
> all.
>
> So, before I resign myself to saying this can't be done, would someone
> take a look at the example and let me know if maybe there is something
> I can still do to make this work?
>
> The CSS is in the file and the code validates:
>
> http://yazminmedia.com/playground/4columnlayout/4column_relative.html

The reason it won't work is that the #wrapper is 996px and all of the  
other columns are designed to fit into a proportion of that width. To  
make your layout work with flexible width columns you may need to have  
a rethink about how you are doing this layout. You either need two  
variations and set appropriate widths for each column based on  
something like a class on the body or wrapper, or you need to have at  
least on of the columns set up to be fluid so that it can take up  
whatever space is available to it.

It is certainly possible to 'shrink wrap' an element (i.e. set its  
width based on the width of its content) and this is achieved by  
floats. You need to float the container and if you are going to wrap  
the ad in a div you need to float that as well.

Cheers, Tim


______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to