HTML Table has many columns, how to add horizontal scroll to view full table?

• 

  nxgauto · Member · Mar 17, 2012 at 2:34 pm

  • Copy link
  • Add topic to favorites

  Dear All,

  I am trying to add HTML Table which has atleast 8-10 columns, when i add it in post & preview it half the columns are not seen…!

  I want to add horizontal scroll in my post blog, so that any viewer can scroll in right & left & see the full table.

  How is this possible in Blog?

  Thanks for your response…

  The blog I need help with is: (visible only to logged in users)

• 

  1tess · Moderator Emeritus · Mar 17, 2012 at 3:07 pm

  • Copy link

  Try this:

  <div style="white-space:pre;overflow:auto;width:500px;padding:10px;">
  CONTENT HERE
  <table style="width:900px;">
  <tr>
  <td>TEXT</td>
  <td>TEXT</td>
  <td>TEXT</td>
  </tr>
  etc………
  </table>
  </div>

• 

  nxgauto · Member · Mar 17, 2012 at 6:29 pm

  • Copy link

  Dear 1tess,

  Thanks a lot… for such fast response… This will solve the issue of horizontal scroll in blog post…

• 

  1tess · Moderator Emeritus · Mar 17, 2012 at 7:09 pm

  • Copy link

  You are welcome.

  (Obviously you can change the widths I showed to match the width of your theme and your table—)