Removing white space between graphic and next button

UmaUma AberdeenCommunity Member Qubie ✭

Removing white space between graphic and next button

Hi there,

I have several places in my survey where I want to display an information screen which I have created in PowerPoint, saved as a jpg file and uploaded as a graphic. My problem is that there is a lot of white space below the bottom of the graphic and the next button which means constantly scrolling down for the next button. I have tried making the image smaller so that the next button is displayed without scrolling but then some of the information in the graphic is too small to see properly - any suggestions?

Thanks

Tagged:

Best Answer

  • TomGTomG Raleigh, NC Wizard ✭✭✭✭✭
    Accepted Answer

    You can reduce or eliminate the top margin and padding on the #Buttons element. For example, for only 10px of space:

    .Skin #Buttons { margin-top:5px; padding-top:5px }
    

    You can add it to a <style> tag in your question text to apply only to the page or in your Look & Feel CSS to apply to the whole survey.

Answers

  • JanetteMJanetteM Community Member Qubie ✭

    Hi,
    I'm also trying to adapt the next and back button and haven't been able to find the answer to my specific question.

    I would like to increase the width (make it fatter) of the next and back arrow, but not sure of the code. The code below works a treat for increasing the size of the arrow but i'm not familiar enough with CSS to know what to write to increase the width/style of the arrow.
    Any advice would be much appreciated. I am learning so much from the Community. Thanks a bunch.

    .Skin #Buttons #NextButton, .Skin #Buttons #PreviousButton {
    font-size:36px
    }

    Cheers,
    Janette

  • TomGTomG Raleigh, NCCommunity Member, Product Ideas Wizard ✭✭✭✭✭

    @JanetteM said:
    Hi,
    I'm also trying to adapt the next and back button and haven't been able to find the answer to my specific question.

    I would like to increase the width (make it fatter) of the next and back arrow, but not sure of the code. The code below works a treat for increasing the size of the arrow but i'm not familiar enough with CSS to know what to write to increase the width/style of the arrow.
    Any advice would be much appreciated. I am learning so much from the Community. Thanks a bunch.

    .Skin #Buttons #NextButton, .Skin #Buttons #PreviousButton {
    font-size:36px
    }

    Cheers,
    Janette

    @Janette - The arrow is a character symbol. You can use a different symbol. In Look & Feel replace the right arrow with &xrarr; (long right arrow).

Sign In to Comment