Hi Nick,
Thanks for using TimeZoneCalculator.
Regarding your question, I recommend to keep the li-tags for semantic purposes, as you want to display a list inline. To format the list you can add some CSS.
Here’s a simplified version of the code which can be inserted as Format of TimeZone-Entry:
<li style="display:inline; margin-right:5px"><abbr title="%name">%abbreviation</abbr>: <span title="%name">%datetime</span></li>
Please note that it’s no good practice to mix up markup and style-code, so you should convert your CSS-code to a class after you’re happy with the results. Moreover, the last child does not need a margin-right.
Here’s a link which explains inline-styling of li-tags.
Another possibility would be to use a special HTML character which would result in
<abbr title="%name">%abbreviation</abbr>: <span title="%name">%datetime</span>
whereas the space at the end is realized by a non-breaking space. Anyway, this method would create an extra space at the end of list.
Hope that helps.
My Best,
Berny
