Semantic Lists
This is an interesting issue because most browsers will actually parse
HTML lists with sublists just fine even when the coding is not 'semantic' or techncially right. The problem is that IE/Mac requires the sublists to be done properly. I have taken the following example from
DmS's excellent tutorial
Whats Behind the Great Designs?. The original code looked like this:
code:
<li>Interface Requirements</li>
<ol type="a">
<li>User Interfaces</li>
<ol type="I">
<li>GUI</li>
<li>API</li>
</ol>
<li>Maintenance output</li>
<li>Hardware Interfaces</li>
<li>Communications Interfaces</li>
<li>Software Interfaces</li>
</ol>
and most recent browsers were happy with that but if you look the child lists aren't actually inside the parent lists and so (at least in IE/Mac) the lists numbering was thrown out. The solution is simple (and semantically correct) and just involves moving the closing parent list bracket so that it now closes after the child list closes:
code:
<li>Interface Requirements
<ol type="a">
<li>User Interfaces
<ol type="I">
<li>GUI</li>
<li>API</li>
</ol>
</li>
<li>Maintenance output</li>
<li>Hardware Interfaces</li>
<li>Communications Interfaces</li>
<li>Software Interfaces</li>
</ol>
</li>
This will now work in (nearly?) all browsers and is 'semantically' correct in that the child is now within the parent tags ;)
This point about lists are mentioned here:
http://www.maxdesign.com.au/presentation/listutorial/sub01.htm
Wicklinks
Semantically Correct (in: 33 | out: 5)
HTML (in: 10 | out: 1)
U Ranker Rankings
We are automatically monitoring the Google rankings that people use to visit this page.
semantic coding child Ranked: 4 (visits: 1)
semantic lists Ranked: 5 (visits: 20)
wiki list numbering Ranked: 8 (visits: 1)
semantic lists Ranked: 11 (visits: 2)
More >>
Syndicate
Syndicate the content on this site:
Blog
Powered by: Wick