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.
On 2 Sep 2005, at 11:38, Bob Easton wrote:
> Edward Sanderson wrote:
>> 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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/