Jump to content

ul lists / sub-lists how to validate


jsaint

Recommended Posts

I am having the a problem getting the W3Validator or the HTML Validator to accept the below indicated type of table with a list and sub-list. I have not been able to find any HTML or CSS references that provide any sample of any kind of information that helps to resolve the Validation problem.Initially I got error msgs that said the <ul> code could not appear in the <td> section with out an Applet, Object, Map etc. Which by the way none of these references appear in the CSS References or in the HTML References.Such Validation error msgs are:---within the <td> tag without the <object> tag -----Error Line 387, column 20: document type does not allow element "UL" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag . <ul class="outside">or -- within the <td> and <object> tags but as a sub-list below an existing <ul> list ---Error Line 414, column 21: document type does not allow element "UL" here; assuming missing "LI" start-tag . <ul class="outside">YET, according to: http://www.w3schools.com/css/css_reference.asp ---- List and Marker reference the following is a perfectly good definition of a list:<html><head></head><body><table><tr><td><ul class="disc"> <li>Coffee</li> <li>Tea</li> <li>Coca Cola</li> <ul class="circle"> <li>Coffee</li> <li>Tea</li> <li>Coca Cola</li> </ul></ul></td></tr></table></body></html>I have searched high and low across the internet looking for a similar problem and have not found one. So I thought I would try here for help.So I added the <object> tag before the first <ul> tag, and that will generate a clean Validation approval. But if you have a sub-list as indicated below, I get the same error msg. I have truncated the web page below as it has not yet been finished to go to our website.FYI: I tried the Applet and Map tags, but they change the sub-list circles to disks and re-align the sub-list to the same as the primary list.How do I obtain a clean Validation of the web page and keep the <ul> list and sub-lists in separate <td> sections?Thank you.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html lang=en><head></head><body> <table border=0 width="100%" cellpadding=5> <tr> <td width="10%"> </td> <td width="40%" valign="top"><font size="2"> <object> <ul class="outside"> <li>Property Acquisition and Disposition</li> <li>Debt / Equity Sourcing and Placement</li> <li>Build-to-Suit and Design Build Services</li> <li>Joint Venture Structuring</li> </ul> </object> </font> </td> <td width="40%" valign=top><font size="2"> <object> <ul class="outside"> <li>Individual and Corporate Real Estate Portfolios</li> <ul class="outside"> <li>Asset Management</li> <li>Property Value Enhancement</li> <li>Property Management</li> <li>Financial and/or Property Expense Analysis</li> </ul> </ul> </object> </font> </td> <td width="10%" align=right valign=bottom><font size="1"> <a href=Scope.htm> Return to <br> Scope of Business</a> </font> <td> </tr></table></body></html>

Link to comment
Share on other sites

Here is where your problem lies: <td width="40%" valign=top> <font size="2"> <ul class="outside"> <li>Individual and Corporate Real Estate Portfolios</li> <ul class="outside"> <li>Asset Management</li> <li>Property Value Enhancement</li> <li>Property Management</li> <li>Financial and/or Property Expense Analysis</li> </ul> </ul> </font> </td>In order to nest lists like you are trying to do, you have to nest the new list completely inside a <li> tag, likeso:

<td width="40%" valign=top>		<font size="2">			<ul class="outside">				<li>Individual and Corporate Real Estate Portfolios<!-- the </li> was removed -->					<ul class="outside">						<li>Asset Management</li>						<li>Property Value Enhancement</li>						<li>Property Management</li>						<li>Financial and/or Property Expense Analysis</li>					</ul>				</li><!-- and added here. Now the preceding list is now nested within one list item -->			</ul>				</font>		</td>

Note the position of the <li> tag. Your list, Assest Management etc. is nested within the list item Individual and Corporate etc.

Link to comment
Share on other sites

Thank Kaitco, that solved the problem completely and I can now get a full page Validation.Not sure who your information should be sent to at both the CSS Reference or HTML Reference, but it should be incorporated.Again many thanks.

Here is where your problem lies: <td width="40%" valign=top> <font size="2"> <ul class="outside"> <li>Individual and Corporate Real Estate Portfolios</li> <ul class="outside"> <li>Asset Management</li> <li>Property Value Enhancement</li> <li>Property Management</li> <li>Financial and/or Property Expense Analysis</li> </ul> </ul> </font> </td>In order to nest lists like you are trying to do, you have to nest the new list completely inside a <li> tag, likeso:
<td width="40%" valign=top>		<font size="2">			<ul class="outside">				<li>Individual and Corporate Real Estate Portfolios<!-- the </li> was removed -->					<ul class="outside">						<li>Asset Management</li>						<li>Property Value Enhancement</li>						<li>Property Management</li>						<li>Financial and/or Property Expense Analysis</li>					</ul>				</li><!-- and added here. Now the preceding list is now nested within one list item -->			</ul>				</font>		</td>

Note the position of the <li> tag. Your list, Assest Management etc. is nested within the list item Individual and Corporate etc.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...