Previous Message
Next Message

3-col layout auto-expanding DIV?

Sent by Edward Sanderson on 4 September 2005 17:05


Just an update to my earlier query...
It makes me spit, but due to deadlines, I'm having to fall-back onto  
tables to get the effect I want. The site now looks like this.

It seems to me that this is a major failing of CSS positioning, that  
a DIV can't recognise it's contents and expand accordingly. Every  
columnar template that I've looked at (I've been through all the  
examples in the WIKI) has this problem. As soon as you place an  
element with a fixed width (e.g. a table/image) in the dynamic DIV  
you leave yourself open to overlap when the container gets smaller  
than the element.

It really pains me to have to add this table  more than I was  
expecting actually  I've really bought into the whole CSS thing and  
this is such a step backwards. It also compromises the accessibility  
of the site.

Oh well, I appreciate the help and feedback I've got from this list  
and I'll post back if I find a solution to this problem.

ed

On 2 Sep 2005, at 11:38, Bob Easton wrote:

> Edward Sanderson wrote:
>
>> Hi,
>> I've made a 3-col site for a client and am having problems with  
>> the  middle column not accommodating it's content.
>> The site is full-width with fixed width side columns and a  
>> flexible  middle (http://eh0647.empetushosting.net/dataspring/ 
>> test.asp). It's  based on Paul O'Brien's template (http:// 
>> www.pmob.co.uk/temp/ 3colfixedtest_explained.htm) with some extra  
>> DIVs to apply a min- width to the page.
>> Everything seemed to be working really well until the client threw  
>> a  really wide table in the centre column - and then in IE(win)  
>> that  column dropped down to below the side columns. In every  
>> other browser  I've tested the content just overflows the right- 
>> hand column, which  is not ideal either.
>> I've been through every three column layout on the WIKI, but I  
>> can  only find advice to avoid wide elements, but no solutions to  
>> the  problem. ...
>>
>
> Yes, the usual advice is to avoid putting 10 pounds of stuff into a  
> 5 pound bag.  There's another solution: use a stretchable bag.
>
> Your layout is unique from the point of view that there are no  
> explicit width constraints on the center column.  Most 3 col  
> layouts have some sort of implicit or explixit width constraints.   
> (I know from starting the 3col page in the WIKI.)  So, where is the  
> next constraint that can limit width?  It's in the #ieWidth  
> declaration which has width:100%. That declaration is doing more  
> than setting min-width.  It is also setting max width at 100% of  
> the viewport.  Your solution needs to expand beyond the viewport  
> for certain pages, doesn't it?
>
> What happens if you comment out that one line?
>
> -- 
> Bob Easton
> Accessibility Matters: http://access-matters.com
>
>

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread:

Possibly related: