alt131 - 12:10 pm on Nov 7, 2011 (gmt 0)

Hi Gemini, there should be no need to introduce another element for this: I'm not quite sure I understand your exact HTML structure. But for this:

<ul> <li>Drinks</li> <li>Tea</li> <li>Milk</li> <li class="nobullet"> </> (I would like this to NOT show a bullet point... <--don't close the </li> <ul> <li>Food</li> <li>Biscuits</li> <li>Bread</li> </ul> </li> <--- close <li> here </ul>

adding the .nobullet class and the style rule .nobullet {list-style-type:none) should do it.

However note that means the nested list is sort of "hanging" with no connection to the main list. So another way would be:

<ul> <li>Drinks</li> <li>Tea</li> <li>Milk <--don't close the </li> <ul> <li>Food</li> <li>Biscuits</li> <li>Bread</li> </ul> </li> <--- close <li> here </ul>

That makes a direct connection between the sub-list and the item in the main list, and you can use
li ul {margin-top:1em/*adjust to suit*/}
(or even the adjacent sibling selector li + ul)