Columns Width for tables from web service | XM Community
Skip to main content
Solved

Columns Width for tables from web service

  • September 1, 2019
  • 6 replies
  • 215 views
C
How can I manage the width of columns of a table within a question? The table is created using a "web service" component (not a qualtrics question type), and currently qualtrics presents the columns with different widths.

Best answer by TomG

> @ClaraT said: > I am not sure how to do that, for a table that is not generated within Qualtrics. Can you please provide some additional instructions? If you control the web service, you could update it to set the widths. If not, you can set the widths using JavaScript. Find the table element and set its width to 100%. Then find the cells within the first row of the table and set their widths (preferably by %).

6 replies

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • September 1, 2019
Set the width (width attribute or width property in the style attribute) on the first cell in each column.
C
  • ClaraT
  • Author
  • September 2, 2019
I am not sure how to do that, for a table that is not generated within Qualtrics. Can you please provide some additional instructions?
TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • Answer
  • September 2, 2019
> @ClaraT said: > I am not sure how to do that, for a table that is not generated within Qualtrics. Can you please provide some additional instructions? If you control the web service, you could update it to set the widths. If not, you can set the widths using JavaScript. Find the table element and set its width to 100%. Then find the cells within the first row of the table and set their widths (preferably by %).
C
C
  • ClaraT
  • Author
  • September 6, 2019
@TomG , thank you for your advice, I got this. For the use of others: - what I did was to enter the HTML view of the question, and insert the following: width=20% width=40% width=40% as is below: ! Of course you can change the size of columns as you wish using %: @MCBWise
S
Forum|alt.badge.img
  • susanadpt
  • August 9, 2022

we encountered the exact same problem, however, defining the column width in html did not solve it. Are there any other approaches? @TomG What is the JavaScript approach you were describing?

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • August 9, 2022

https://community.qualtrics.com/XMcommunity/discussion/comment/48344#Comment_48344Several thoughts:

  • The widths in the html provided above should have been in quotes

  • Using css widths (e.g. 
    style='width:25%;'
    is generally more effective that the width attribute (they aren't exactly equivalent).

  • A more flexible approach is to assign classes to html elements then use custom css to format them. If you control the web service, this is a better approach than JS.

  • If you use JS, find the cells in the first row of the table and set their css width.

Terms & ConditionsAccessibility statement