HTML for long list of words

Home Forums Web Hosting Forum HTML for long list of words


This topic contains 1 reply, has 2 voices, and was last updated by  Keith Taylor 3 years, 10 months ago.

  • Author
  • #2700

    Ŧollars: Ŧ 54.50

    When I’m presenting a long list of words I often use a spreadsheet. Then I can add columns to add HTML tags for lists, tables, or Definition Lists.

    I’ve got a long list of single words that I want to show as comma-separated. Or, better still, semicolon separated.

    Is there an easy way to do this?

  • #2704

    Keith Taylor
    Ŧollars: Ŧ 1 ,191.16

    If you want to split columns across the page, the CSS3 multi-column mode is now supported by more browsers. It’s not something I’ve used much, but I will be experimenting with it.

    Sometimes, its best just to keep it simple. In this case, that means reformatting your list of words, rather than using HTML to display differently. I found a great Free Comma Separating Tool. Fortunately, it does much more than commas. 🙂

    By default, the dropdown list of word separators offers comma, semicolon, pipe (|), and a single space. Confusingly, the dropdown says ‘Spaces’ but only inserts a single space. In any case, if text is to be pasted into a web page, multiple spaces are irrelevant (unless you use code or pre tags). This is because HTML ignores multiple spaces.

    For normal content writing, we need commas or semicolons between lists of words in sentence style. Unfortunately, this tool would present lists of words

    Fortunately, the tool has Converter Settings below the input/output form. There, you can specify your own delimiters. Note that you cannot type spaces into the ‘Delimiter’ option. However, we can use HTML Numbers and HTML names. The ‘space’ character does not have a name, so we use it’s ascii decimal number: 32. This is written as &#032 ;

    Note: there should not be a space after the 2. I have to show it that way as a bug causes the #032; code to change back to a space! 😕

    Recently, I used this technique with a semicolon and space between each word. however, I thought it looked better with 2 spaces. As I said, we cannot use two normal spaces, as browsers will only display a single space. However, HTML has a character called ‘hard space’ or ‘non-breaking space’ which has the HTML name:  

    If we only use hard spaces, we get a single word. When that is displayed, it will be hyphenated. Or, it will scroll across the screen on one line, depending on styling settings.

    To overcome this, we follow hard spaces with a normal soft space. I used ;  &#032 ; which turns:


    into: I;   Love;   Shrewdies;   Web;   Hosting;   Forum 😀

You must be logged in to reply to this topic.