OK - playing with FW6 here in Html5 mode.
What settings would I/could I use on my 3 columns so that unequal amounts of text would still ensure that they were full height in an inline Html5 layout.
Or is FW on its own is not capable of this and I have to use one of the other methods.
David
http://www.deltadesign.co/radar/columns.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi D,
first a word to your construction:
You probably heard somewhere that the first float needs to be set “fright” then “left”, do you? Out of my experience, forget it - this is no issue in any modern browser anymore. So set the float for all three boxes to left. This ensures, that the sorting order in source code is col1, col2, col3 and not the other way round.
Your basic question:
No idea - but I’m pretty sure, that a couple of java-script lines could ensure an equal height of the columns. Something like:
height of (col1, col2, col3) is equal to current max-height of (col1, col2, col3) blabla roger, over and out.
What I do in practice is, to wait on clients content, add it, have a look at the most high column and set a min-height for all of them (primitive but usually helpful for a starting-point).
Cheers
Thomas
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
You want columns of equal height or unequal content of equal height?
All three columns look the same height to me - the height of the largest
content block.
–
Ernie Simpson
On Sat, Feb 2, 2013 at 3:59 PM, DeltaDave email@hidden wrote:
OK - playing with FW6 here in Html5 mode.
What settings would I/could I use on my 3 columns so that unequal amounts
of text would still ensure that they were full height in an inline Html5
layout.Or is FW on its own is not capable of this and I have to use one of the
other methods.David
http://www.deltadesign.co/radar/columns.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
If the items are all set to collapse height, then they will shrink to the height of the content within each one. The usual way to make columns appear to be full-height is to use a background image on a parent item to fake the column (look in Bulletproof Web Design for “faux columns”) or some other sleight of hand.
The JavaScript solution is very simple:
var boxes = $$('#foo, #bar, #baz);
var height = boxes.map(function(elm){ return elm.getHeight(); }).max();
boxes.invoke('setStyle', 'height', maximum + 'px');
Naturally, that’s Prototype code, and naturally foo, bar, and baz need to be your columns’ ids.
Walter
On Feb 2, 2013, at 3:59 PM, DeltaDave wrote:
OK - playing with FW6 here in Html5 mode.
What settings would I/could I use on my 3 columns so that unequal amounts of text would still ensure that they were full height in an inline Html5 layout.
Or is FW on its own is not capable of this and I have to use one of the other methods.
David
http://www.deltadesign.co/radar/columns.html
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
You want columns of equal height or unequal content of equal height?
I want columns that have different length of text content but a background colour to all appear to be the same height. Like this http://www.deltadesign.co/radar/columns3.html
But you knew that 
And I don’t want to have to use JS - I just would like FW to be capable of doing it on its own with all these new fangled settings that are now available.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
If the items are all set to collapse height,
I was using the new setting of height: Minimum% = 100% hoping that would do it.
D
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
The JavaScript solution is very simple:
Yes Walter - for you!
Even with my limited JS knowledge I see a problem with your code in the first line
var boxes = $$(’#foo, #bar, #baz);
It gave me SyntaxError: Unexpected EOF
should that be
var boxes = $$(’#foo, #bar, #baz’);
Which then gave me “can’t find the variable maximum”
So changed line 3 to
boxes.invoke(‘setStyle’, ‘height’, ‘maximum’ + ‘px’);
and No Errors, no result
- I only know enough to be dangerous!
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Too many things going on at once. Here it is working:
So many mistakes on my part in what I wrote off the top of my head…
Walter
On Feb 2, 2013, at 6:16 PM, DeltaDave wrote:
The JavaScript solution is very simple:
Yes Walter - for you!
Even with my limited JS knowledge I see a problem with your code in the first line
var boxes = $$(’#foo, #bar, #baz);
It gave me SyntaxError: Unexpected EOF
should that be
var boxes = $$(’#foo, #bar, #baz’);
Which then gave me “can’t find the variable maximum”
So changed line 3 to
boxes.invoke(‘setStyle’, ‘height’, ‘maximum’ + ‘px’);
and No Errors, no result
- I only know enough to be dangerous!
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Here’s a pure-CSS way to do it, but I’m not sure about browser support for display: table-cell. Best to check caniuse.
Walter
On Feb 2, 2013, at 5:31 PM, DeltaDave wrote:
And I don’t want to have to use JS - I just would like FW to be capable of doing it on its own with all these new fangled settings that are now available.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Thanks Walter - the JS was easy to apply and works great.
I will look at the CSS method too.
D
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options