Skip to main content area Skip to institutional navigation Skip to sub-navigation

Tables

Tables can be used in certain situations where you need to organize specific pieces of content, such as course schedules.  See the Best Practices Web Page Content page for recommended uses for tables and look at the Layouts and Style Guides section for table examples in the Offices and Departments Style Guides.


How to Create a Basic Table:

  • From the WYSIWYG in any content item, place the cursor where you want to create the table.
  • Click on the "Insert New Table" icon in the WYSIWYG toolbar to bring up the "Insert/Modify Table" dialogue box.
  • Change the number of rows and columns to the number of each that you want for the new table.
  • Once you are finished, click "Insert".
  • You will be taken back to the WYSIWYG where you can now enter content into the cells of the table.
  • Note: You can edit the table's main settings at any time by highlighting the table and clicking the "Insert New Table" icon again.

Watch the video >>


How to Add a Row or Column:

  • From the WYSIWYG in any content item, select all the cells in a column or row adjacent to where you want to insert a new column or row.
  • Click on the "Insert Row Before", "Insert Row After", "Insert Column Before" or "Insert Column After" icon in the WYSIWYG toolbar.

Watch the video >>


How to Delete a Row or Column:

  • From the WYSIWYG in any content item, select all the cells in a column or row adjacent to where you want to insert a new column or row.
  • Click on the "Delete Row" or "Delete Column" icon in the WYSIWYG toolbar.

Watch the video >>


How to Adjust Cellpadding and Cellspacing in a Table:

  • From the WYSIWYG in any content item, highlight the table the table that you wish to modify.
  • Click on the "Insert New Table" icon in the WYSIWYG toolbar to bring up the "Insert/Modify Table" dialogue box.
  • Fill in the text field for cellpadding (room between the text and the edge of the table cell) and cellspacing (space between cells). Enter a number in the text field in pixels, but do not include the letters px after the number.
  • Once you are finished, click "Insert".
  • You will be taken back to the WYSIWYG where you can now enter content into the cells of the table.

Watch the video >>


How to Wrap Text Around a Table:

  • From the WYSIWYG in any content item, highlight the table that you wish to modify.
  • Click on the "Insert New Table" icon in the WYSIWYG toolbar to bring up the "Insert/Modify Table" dialogue box.
  • Choose either right, left or center from the "Alignment" drop down.
  • Once you are finished, click "Insert".
  • You will be taken back to the WYSIWYG where you can now enter content into the cells of the table.

Watch the video >>


How to Set the Width and Height of a Table:

  • From the WYSIWYG in any content item, highlight the table that you wish to modify.
  • Click on the "Insert New Table" icon in the WYSIWYG toolbar to bring up the "Insert/Modify Table" dialogue box.
  • Choose a width and a height either in percent (include the % symbol after the number) or in pixels (include the letters px after the number).
  • Once you are finished, click "Insert".
  • You will be taken back to the WYSIWYG where you can now enter content into the cells of the table.

Watch the video >>


How to Set the Border Width and Color of a Table:

  • From the WYSIWYG in any content item, highlight the table that you wish to modify.
  • Click on the "Insert New Table" icon in the WYSIWYG toolbar to bring up the "Insert/Modify Table" dialogue box.
  • Choose a border width and fill in the "Border" text field with a number. Enter a number in the text field in pixels, but do not include the letters px after the number.
  • Click on the "Advanced" tab
  • Choose a border color from the color picker field.
  • Once you are finished, click "Insert".
  • You will be taken back to the WYSIWYG where you can now enter content into the cells of the table.

Watch the video >>


How to Create a Heading Row:

  • From the WYSIWYG in any content item, select all the cells in the row you wish to modify.
  • Click on the "Table Cell Properties" icon in the WYSIWYG toolbar to bring up the "Table Cell Properties" dialogue box.
  • In the "Cell Type" dropdown, choose "Header".
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the cells you have selected.
  • When you are finished formatting the cells, click "Insert".

Watch the video >>


How to Edit the Background Color of Table Rows:

  • From the WYSIWYG in any content item, place your cursor somewhere in the table on the row you wish to modify.
  • Click on the "Table Row Properties" icon in the WYSIWYG toolbar to bring up the "Table Row Properties" dialogue box.
  • To change the background color of a row (cream is the default, but white can be used as well) in the "Class" dropdown select "value", then type "zebra" into the field that appears.
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the row you are on or those you have selected, only odd rows, only even rows, or all rows in the table.
  • When you are finished formatting the row(s), click "Insert".

Watch the video >>


How to Align the Text of a Row:

  • From the WYSIWYG in any content item, place your cursor somewhere in the table on the row you wish to modify.
  • Click on the "Table Row Properties" icon in the WYSIWYG toolbar to bring up the "Table Row Properties" dialogue box.
  • To align the text within the cells, choose the options from the "Alignment" and "Vertical Alignment" drop downs.
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the row you are on or those you have selected, only odd rows, only even rows, or all rows in the table.
  • When you are finished formatting the row(s), click "Insert".

Watch the video >>


How to Set the Height of a Row:

  • From the WYSIWYG in any content item, place your cursor somewhere in the table on the row you wish to modify.
  • Click on the "Table Row Properties" icon in the WYSIWYG toolbar to bring up the "Table Row Properties" dialogue box.
  • Enter a number in the height field in percent (include the % symbol after the number) or in pixels (include the letters px after the number).
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the row you are on or those you have selected, only odd rows, only even rows, or all rows in the table.
  • When you are finished formatting the row(s), click "Insert".

Watch the video >>


How to Create a Heading Column:

  • From the WYSIWYG in any content item, select all the cells in the column you wish to modify.
  • Click on the "Table Cell Properties" icon in the WYSIWYG toolbar to bring up the "Table Cell Properties" dialogue box.
  • In the "Cell Type" dropdown, choose "Header".
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the cells you have selected.
  • When you are finished formatting the cells, click "Insert".

Watch the video >>


How to Adjust Column or Cell Width and Height:

  • From the WYSIWYG in any content item, select all the cells you wish to modify.
  • Click on the "Table Cell Properties" icon in the WYSIWYG toolbar to bring up the "Table Cell Properties" dialogue box.
  • Enter a number in the width and height fields in percent (include the % symbol after the number) or in pixels (include the letters px after the number).
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the cells you have selected.
  • When you are finished formatting the cells, click "Insert".

Watch the video >>


How to Set Border Color in a Column or Cell(s):

  • From the WYSIWYG in any content item, select all the cells you wish to modify.
  • Click on the "Table Cell Properties" icon in the WYSIWYG toolbar to bring up the "Table Cell Properties" dialogue box.
  • Choose a border color from the color picker field.
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the cells you have selected.
  • When you are finished formatting the cells, click "Insert".

Watch the video >>


How to Align Text in a Column or Cell(s):

  • From the WYSIWYG in any content item, select all the cells you wish to modify.
  • Click on the "Table Cell Properties" icon in the WYSIWYG toolbar to bring up the "Table Cell Properties" dialogue box.
  • Choose the options from the "Alignment" and "Vertical Alignment" drop downs.
  • Just above the "Insert" button, there is a dropdown that allows you to apply your changes to only the cells you have selected.
  • When you are finished formatting the cells, click "Insert".

Watch the video >>