How can I reduce the space between lines (from double to single space)? | XM Community
Skip to main content
Solved

How can I reduce the space between lines (from double to single space)?

  • January 8, 2020
  • 19 replies
  • 5414 views
T
How do I remove the space between lines in "text/graphic" questions? Right now, there seems to be a double space between lines and I would like it to be single space. Thank you!

Best answer by TomG

Just add the same rule to Look & Feel -> Style -> CSS and it will override it. What's strange is changing it to 1.9em should make the space bigger, not smaller. Maybe you meant to type 1.0em? ``` .Skin .QuestionText { line-height: 1.0em; } ```
    W

    19 replies

    T
    • Thebika
    • Author
    • January 8, 2020
    How do I remove the space between lines in "text/graphic" questions? Right now, there seems to be a double space between lines and I would like it to be single space. Thank you!
    D
    Level 1 ●
    Forum|alt.badge.img+1
    • Dsoohoo
    • Level 1 ●
    • January 8, 2020
    @thebika I'm having similar issues and am working on finding solutions right now. Can you please post up a screenshot of what you are seeing?
    T
    • Thebika
    • Author
    • January 8, 2020
    @Dsoohoo ! For some reason, it's only happening to all of the text questions in only one of my blocks.
    D
    Level 1 ●
    Forum|alt.badge.img+1
    • Dsoohoo
    • Level 1 ●
    • January 8, 2020
    @thebika Is it possible to just create a new block and use the same question(s)? I'm not sure how many questions your block contains, but I encounter similar problems when I usually copy and paste questions.
    T
    • Thebika
    • Author
    • January 8, 2020
    @Dsoohoo Thank you for the idea. I just tried that and unfortunately it did not work. I'm wondering if there is javascript code I would be able to use.
    K
    Level 5 ●●●●●
    Forum|alt.badge.img+19
    • Kate
    • Level 5 ●●●●●
    • January 8, 2020
    Click the question, open the "Rich Content Editor". You should be able to remove it there. But if you need to open the code, look for ```<br>``` and delete the extra <br>. ! Also, don't forget that it could just be white space on your image. If the image isn't closely trimmed, it might just be displaying the image, not creating spaces. If you don't see spaces on the rich content editor, and there are no ```<br>``` in the code, then you need to crop the image, it's not a code problem.
    T
    • Thebika
    • Author
    • January 8, 2020
    @Kate The spacing between the lines happens between lines of text. Please see example below. ! I don't see any breaks where they shouldn't be. Do you know if there is anything else I can add to the code? I understand there is something called line-spacing but i'm not sure how to use it.
    K
    Level 5 ●●●●●
    Forum|alt.badge.img+19
    • Kate
    • Level 5 ●●●●●
    • January 8, 2020
    @Thebika can you show us a copy of the code like I did? In your example, that is an image. So the lines need to be removed from the image. If you can show us the real stuff you're working with we can get closer to the solution! In HTML code, line spacing is the ```<br>``` that I showed you. So I'm not sure what else we're looking for here.
    JacquelineS
    T
    • Thebika
    • Author
    • January 10, 2020
    So, the issue for me is that there is a double space instead of a single space between the lines lines in my text paragraph when I go to html view, this is what I see. ! Similar to this video I found online: https://www.youtube.com/watch?v=bFIFp12aLv8
    TomG
    Level 8 ●●●●●●●●
    Forum|alt.badge.img+27
    • TomG
    • Level 8 ●●●●●●●●
    • January 10, 2020
    Try removing the `<p>` and `</p>` tags
    K
    T
    • Thebika
    • Author
    • January 10, 2020
    @TomG Just tried that. Unfortunately, no luck. It seems as though if I choose to specify the format of the paragraph with font and size then the double space is more prominent. If I remove all formatting, the space isn't as big.
    TomG
    Level 8 ●●●●●●●●
    Forum|alt.badge.img+27
    • TomG
    • Level 8 ●●●●●●●●
    • January 10, 2020
    > @Thebika said: > @TomG > > Just tried that. Unfortunately, no luck. It seems as though if I choose to specify the format of the paragraph with font and size then the double space is more prominent. If I remove all formatting, the space isn't as big. That was an attempt at an easy fix. Preview the block, hover over the question text, right click and Inspect. Look at the element's CSS to figure out what is causing the spacing (probably a line-height style), then create a CSS rule to override it.
    T
    • Thebika
    • Author
    • January 13, 2020
    @TomG Hi Tom, Thank you for that suggestion. When I click on "Question Text" and change the line-height from 1.5em to 1.9em in inspect, the space between the lines becomes smaller. ! I'm not very familiar with CSS. Do you a CSS rule I could use to override it?
    TomG
    Level 8 ●●●●●●●●
    Forum|alt.badge.img+27
    • TomG
    • Level 8 ●●●●●●●●
    • Answer
    • January 13, 2020
    Just add the same rule to Look & Feel -> Style -> CSS and it will override it. What's strange is changing it to 1.9em should make the space bigger, not smaller. Maybe you meant to type 1.0em? ``` .Skin .QuestionText { line-height: 1.0em; } ```
    T
    G
    T
    • Thebika
    • Author
    • January 13, 2020
    @TomG Oh yes! I meant to say changing it from 1.5em to 0.9em.
    T
    • Thebika
    • Author
    • January 13, 2020
    @TomG It worked! Thank you! Is there a way I can use this CSS code for a specific block?
    TomG
    Level 8 ●●●●●●●●
    Forum|alt.badge.img+27
    • TomG
    • Level 8 ●●●●●●●●
    • January 13, 2020
    > @Thebika said: > @TomG > > It worked! Thank you! > > Is there a way I can use this CSS code for a specific block? You can add it in a `<style>` tag to the question text of the first question on each page of the block. EDIT: On second thought, it might be easier just to change your `<p><span>` in the question text to a `<div>` and include line-height in the style attribute.
    M
    Forum|alt.badge.img
    • Mich
    • January 23, 2022

    Hi Thebika,
    I wrestled with this too. I found this clear explanation online and wanted to share with this community. p-style= is the HTML command you need. Don't forget to put

    at the end of your text.
    Technology Sharing: How to Adjust the Line Spacing of a Qualtrics Survey Form?Specifying a line height of 0.9 worked a treat for 3 lines of nice, tight text in my survey, as below.

    Sample Survey Round One

    Release Date: 20 12 2021
     
    Closing Date : 19 01 2022





    J
    Forum|alt.badge.img
    • JillAndrea
    • January 23, 2023

    Hi All,
    Chiming in with my feedback. I too had an issue with double spacing only on the Text/Graphic question type, but spacing was normal on all other question types. If I changed the CSS code, it reduced the line spacing on other question types too much.
    Initially, I tried using span tags to change the line spacing on my Text/Graphic question but it did not work. Then I tried Mich's suggestion above and used the p-tags instead and it worked perfectly.
    My method - edit the question text, select Rich Text Formatting, and then go into source code. Add this code, which works perfectly:

    your text here

    Your text here
     
    Your text here



    Terms & ConditionsAccessibility statement