Rendering long lists

kelvSYC

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

--
I am only a mirage.

Jul 20 '05 #1

Geoff Ball

kelvSYC <ke*****@no.email.shaw.ca> wrote in news:260520042206151583%
ke*****@no.email.shaw.ca:

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

What's going in the list? Is it tabular data?

Regards,
Geoff

Jul 20 '05 #2

Neal

On Thu, 27 May 2004 04:06:16 GMT, kelvSYC <ke*****@no.email.shaw.ca> wrote:

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

You could float all the list items left. Set a width of 19%, or so.
Untested, but ought to work.

Or, set width: auto (again, this is untested). They won't line up pretty,
but you'll get maximum use of space.

Jul 20 '05 #3

Vladdy

Neal wrote:

On Thu, 27 May 2004 04:06:16 GMT, kelvSYC <ke*****@no.email.shaw.ca> wrote:

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

You could float all the list items left. Set a width of 19%, or so.
Untested, but ought to work.

Or, set width: auto (again, this is untested). They won't line up
pretty, but you'll get maximum use of space.

Here is a demo of what Neal suggested:
www.vladdy.net/demos/gallery.html
--
Vladdy
http://www.klproductions.com

Jul 20 '05 #4

kelvSYC

In article <Xn****************************@24.71.223.159>, Geoff Ball
<us****@geoffball.ca> wrote:

kelvSYC <ke*****@no.email.shaw.ca> wrote in news:260520042206151583%
ke*****@no.email.shaw.ca:

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

What's going in the list? Is it tabular data?

Not really. I used what is essentially a hack and an abuse of <div>
elements to deal with the whitespace concerns. I'm trying to find
something using CSS that doesn't abuse something like

<div style="display:table">
<div style="display:table-row">
<div style="display:table-cell">
</div>
</div>
</div>

--
I am only a mirage.

Jul 20 '05 #5

kelvSYC

In article <qA*******************@nwrdny01.gnilink.net>, Vladdy
<vl**@klproductions.com> wrote:

Neal wrote:

On Thu, 27 May 2004 04:06:16 GMT, kelvSYC <ke*****@no.email.shaw.ca> wrote:

Say I have a really long list (more than 100 items, say). Because of
the enormous vertical space it takes up, I decide to present them in a
a way that I put five list items in a line (ie. the sixth item appears
under the first, seventh under the second, and so on). However, I
can't think of a way to do this with a minimal amount of XHTML.

So far, I've used divs to simulate layout-tables, but I believe a more
elegant and flexible solution exists. Is there a way to do this with a
minimum of XHTML, and using as much CSS as possible?

You could float all the list items left. Set a width of 19%, or so.
Untested, but ought to work.

Or, set width: auto (again, this is untested). They won't line up
pretty, but you'll get maximum use of space.

Here is a demo of what Neal suggested:
www.vladdy.net/demos/gallery.html

I like it, but is there a way that I can do this without having to make
a box whose sole purpose is to clear both sides (like that hr element)?

--
I am only a mirage.

Jul 20 '05 #6

Jukka K. Korpela

kelvSYC <ke*****@no.email.shaw.ca> wrote:

I used what is essentially a hack and an abuse of <div>
elements to deal with the whitespace concerns.

I think you should explain what you are dealing with and trying to
accomplish, rather than give vague hints of what you are _not_ doing.

That is, please post the URL of the unstyled document, and explain what
the desired rendering is. This really depends on what kind of stuff you
have in the list, or "list".

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Jul 20 '05 #7