multi-column lists

D

dorayme

Lewis said:
This is what I ended up with, which works in FF3.$CURRENT and Chrome and
Safari. It's an internal page on my Mac, so I didn't bother to check it
in IE.

<<<EOF
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Big Read</title>
<style type="text/css">
.list
{
column-count: 2;
-moz-column-count: 2;
-webkit-column-count: 2;
....

If it is for your internal use, and works to your satisfaction
for your internal use, what more can be said! It would not be
satisfactory for others, not even on a Mac.
 
L

Lewis

In message said:
If it is for your internal use, and works to your satisfaction
for your internal use, what more can be said! It would not be
satisfactory for others, not even on a Mac.

Yeah, I was also playing around with some other stuff at the time (which
is why .author is a block level item), but the columns work on all
the browsers I use, so that is good enough at least until they go with
the standard column-count directive.

I've had to do a lot of these dual column things over the ages, and it's
nice to know I can put aside all those hacks and floats and can
trivially change from 1 to 2 to 3 to 6 columns.ZZ
 
D

dorayme

Lewis said:
In message said:
Yeah, I was also playing around with some other stuff at the time (which
is why .author is a block level item), but the columns work on all
the browsers I use, so that is good enough at least until they go with
the standard column-count directive.

I've had to do a lot of these dual column things over the ages, and it's
nice to know I can put aside all those hacks and floats and can
trivially change from 1 to 2 to 3 to 6 columns.ZZ

Using css3 is absolutely fine for personal use, simply because
you know the browsers that support it.

It is also fine for public use when you don't know what browsers
will be used if you make the pages have a fallback look that you
deem satisfactory (and one that is beyond mere el basic browser
defaults). Sort of 'do no harm'!

In the example you gave, the main thing that many would not like
even if they were using supportive browsers was the lack of
fluidity. I think quite a few of us would need to be horizontally
scrolling a fair bit or else ensure our browsers were about
1400px or near there (way too wide out of *necessity*).

Just by the way, considering your example of book titles and
authors, my first thought would be to markup with a two or three
col table. But that might not have suited your needs. It would
certainly suit the ordering, and be html semantically richer.
 
L

Lewis

In message said:
In the example you gave, the main thing that many would not like
even if they were using supportive browsers was the lack of
fluidity. I think quite a few of us would need to be horizontally
scrolling a fair bit or else ensure our browsers were about
1400px or near there (way too wide out of *necessity*).

Your font size must be huge. I have the div containing the list set to
min-width: 65em; and max-width: 85em; Smaller widths cause the author to
overlap the names of some of the books, and wider ones seemed silly.

On my screen, a width of 1050 pixels contains the list just fine, and I
don't know anyone anymore who's screen is not at least 1280 pixels wide.
Even the iPad boasts 1024, just about enough to fit.

(it's 1080 pixels in Chrome for some reason)
Just by the way, considering your example of book titles and
authors, my first thought would be to markup with a two or three
col table. But that might not have suited your needs. It would
certainly suit the ordering, and be html semantically richer.

I looked at 3 columns, but it was too crowded with some of the longer
titles or longer names.
 
D

dorayme

Lewis said:
Your font size must be huge.

Not really. Here is a screenshot untampered with re size:

<http://dorayme.netweaver.com.au/justPics/screenshotOfLewisPage.pn
g>

The problem is elsewhere and quite fundamental. If someone wanted
fluid and the convenience of being able to have much smaller
browser windows, they would need to design quite differently.
I looked at 3 columns, but it was too crowded with some of the longer
titles or longer names.

The third col I was mentioning for a table design was for the
order to be marked, not wider than the numbers needed. In respect
to longer titles and names, a table is absolutely ideal, the
magic of the cell being that it wraps text *within* the cell and
that is hunky dory for fluid design.

As I said, if your markup suits you, well... good for you!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
474,077
Messages
2,570,566
Members
47,202
Latest member
misc.

Latest Threads

Top