HTML Table with horizontal & vertical scrolling

I blog very frequently and sometimes the posts contain code snippets. The site template sometimes limits the available real-estate and this can cause certain issues. If there is long text in one line, then they are stripped and will not be visible.

The solution to this is to:

  • Use a template which provides more real-estate.
    OR
  • Use a scrollable HTML table.

If you chose the second option of a scrollable HTML table, below is a sample code-snippet that you can use to achieve this. The below snippet provides horizontal scrolling only. You can modify the same to achieve vertical scrolling

 

This is how it looks in different browsers:

image