StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I'd recommend using an unordered list -- <code><ul></code>, and apply the CSS <code>float</code> attribute to its list items (<code><li></code>). That way, you won't have to worry about counting the number of records.</p> <p>Just output each record in a <code><li></code>, and set them all to <code>float: left;</code>.</p> <p>Then constrain the height of the <code><ul></code> so it will be short enough to force the extra <code><li></code>s to float to a new column.</p> <p>As @Steve pointed out, you'll also need to set the <code><li></code> width to be constant so the columns will be consistent. And make the width of your <code><ul></code> more than twice and less than three times as big as the <code><li></code> width.</p> <p>A basic way to do that would be to call <code>mysql_num_rows()</code> on your query. Multiply the result by the height of each <code><li></code>, then divide by two, and that will be the height of your <code><ul></code>. That will make each column of equal height.</p> <p>You <em>could</em> also do it with <code><div></code>s (one <code><div></code> for each item, all wrapped in a single global <code><div></code>).</p> <p>But using a list is the preferred way of displaying a list of information in HTML (unless the information is tabular in nature and requires multiple columns per field, which yours isn't and doesn't).</p> <p>If you need more detailed help, there's a <a href="http://dev.opera.com/articles/view/32-styling-lists-and-links/#fauxcolumns" rel="nofollow">great Opera Web Standards article</a> on this.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload