How?
I see oodles of guides and prefabbed layouts for the more common center-fluid/sides-fixed version of the 3-column layout, but can't find one for the combination I need.
Thanks in advance for any ideas/help/comments/pointers/css/urls/…
;)
Printable View
How?
I see oodles of guides and prefabbed layouts for the more common center-fluid/sides-fixed version of the 3-column layout, but can't find one for the combination I need.
Thanks in advance for any ideas/help/comments/pointers/css/urls/…
;)
Hi Bill,
I did this some time ago as an exercise but I haven't re-visited it lately so I hope its of some use.
http://www.pmob.co.uk/temp/3colfluidsides1.htm
I'm not sure how it will stand up in real use but your welcome to use it. I haven't seen anyone else do this either :) (in css)
Paul
I was hoping there might be a simpelr, claener way of doing it.
Your method seems to work in Safari, but MSIE5 barfs on it. and I don't have the energy left to find a tweak to satisfy MSIE/Mac.
The actual application is for this visual effect.
I was hoping to find a non-stacking solution, which is where this specific layout request came from.
As you can see, the left column ("rectoverso") is only used to visually support the central, horizontally-centered main container 'page'.
In the end it was simpler to lay down a 50% wide div tucked into the left and using it to hold a tiling background.
I then horizontally centered the main container div using the dead center/negative margin method ( *spit* *spit* ).
I'd hoped to avoid using position: absolute; on the container div, but had to for the sake of z-indexing (FF/Moz not being a big fan of negative z-index values)
As mentioned, I'd hoped that there would be a more regular solution, as I wanted to avoid using a stacking solution and I've never been a big fan of the negative margin kludge, but it seems to produce the most consistent results as well as being the lightest in terms of the amount of markup/css.
Perhaps I should stop writing off absolute, stacking solutions. ;)
Thx all the same for the attempt, Paul.
Hi Bill,
What you have seems to work quite well and is pretty compact so its probably not worth messing with it ;)
The only drawback I can see is that using the dead centre/negative margin technique is that the layout slides all the way off the left side as the screen is resized smaller. You could avoid that by using the margin-left:auto and margin-right:auto centering and then the container, header and footer could all be statically positioned (with position:relative for stacking order etc.)
But I'm well aware that you may have already tried that method (and many others) anyway, so I'm probably wasting your time ;)
Paul
Nono…Quote:
Originally Posted by Paul O'B
I could have sworn that I'd tried that, but clearly not as it does solve all the problems.
God knows what I was doing wrong/differently.
My head clearly wasn't on straight yesterday, so thanks for the 'coffee call'. ;)