...

View Full Version : unordered lists and repeating regions



taffd
07-30-2007, 06:08 PM
I'm trying to convert myverdict.net from table based to css based. Virtually all the pages are dynamic. I use dreamweaver and php.

Assuming I want to store links in a database. At the moment I present them on a page by having a 1 row, 1 column table and making it a repeating region, viewable only if results are returned.
Is it possible to achieve the same thing using the unordered list tags with css. I tried tentatively yesterday but the results were printed across the page rather than as a list.
Thanks in advance.
PS. I don't need the exact code just a general answer.

BWiz
07-30-2007, 06:21 PM
If I am not misunderstanding you, the problem which you have encountered may have something to do with your PHP code.

taffd
07-30-2007, 09:24 PM
BWiz,
I think you may have misunderstood. The php is fine, my site works as it is. When I query my database, it returns more than one row. In order to display more than one row I use 1 row table as a repeating region, hence getting as many rows as there are returned by the query. I was wondering if it could be done withcss and the list tags.

Arbitrator
07-30-2007, 11:08 PM
Assuming I want to store links in a database. At the moment I present them on a page by having a 1 row, 1 column table and making it a repeating region, viewable only if results are returned.
Is it possible to achieve the same thing using the unordered list tags with css. I tried tentatively yesterday but the results were printed across the page rather than as a list.Visually, yes. Semantically, no.

The proper semantic elements here would either be a table or a combination of definition lists, headers, and/or tables. Your current use of tables is semantically incorrect since the headers and data should be separate and marked up as such.

I can see it being rewritten into a semantic table (or five semantic tables) with the exception of the “International questions” part, since it follows a different display convention. The column layout should be possible via floats and clearing. Semantic hyphenation would have to be done via background images due to Internet Explorer’s lack of support for the content property.

taffd
07-31-2007, 12:09 AM
Arbitrator,
Thanks for that. As I understand it you have actually viewed the site and you're discussing the homepage. I understand about headers and data being separate and can fix that easily. I don't understand semantic tables, so I'll do some research to further the cause and report back.

Arbitrator
07-31-2007, 12:53 AM
As I understand it you have actually viewed the site and you're discussing the homepage.Correct.


I don't understand semantic tables, so I'll do some research to further the cause and report back.It means that you should use tables how there were meant to be used (to associate data) via the facilities designed for that. For example, “United Kingdom - 11” does that implicitly. Arguably, that’s a correct way to associate data, but it would mean that the table is being used incorrectly since data is not being associated nor would it be as useful to automated or assistive technologies (search engines, screen readers, et al).

Both of the below usages of tables explicitly associate data.

Semantic Table:

<table>
<tbody>
<tr>
<th scope="rowgroup" colspan="2">national questions by country</th>
</tr>
<tr>
<th scope="row">Spain</th>
<td>1</td>
</tr>
<tr>
<th scope="row">United Kingdom</th>
<td>11</td>
</tr>
<tr>
<th scope="row">United States</th>
<td>3</td>
</tr>
</tbody>
<tbody>
<tr>
<th scope="rowgroup" colspan="2">primary division questions</th>
</tr>
<tr>
<th scope="row">England</th>
<td>1</td>
</tr>
<tr>
<th scope="row">Wisconson</th>
<td>1</td>
</tr>
</tbody>
</table>

Semantic Tables (less straightforward to allow for greater presentational control; then again, there are browser issues would styling table captions):

<table>
<caption>national questions by country</caption>
<tbody>
<tr>
<th scope="row">Spain</th>
<td>1</td>
</tr>
<tr>
<th scope="row">United Kingdom</th>
<td>11</td>
</tr>
<tr>
<th scope="row">United States</th>
<td>3</td>
</tr>
</tbody>
</table>
<table>
<caption>primary division questions</caption>
<tbody>
<tr>
<th scope="row">England</th>
<td>1</td>
</tr>
<tr>
<th scope="row">Wisconson</th>
<td>1</td>
</tr>
</tbody>
</table>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum