# How to place gif on the right and text on the left

**URL:** <https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819>\
**Category:** Customer Experience (All Surveys)\
**Created:** [October 21, 2022, 8:21am UTC](https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819 "2022-10-21T08:21:44Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![frederike.freitag](https://avatars.discourse-cdn.com/v4/letter/f/f08c70/32.png) [@frederike.freitag](https://community.surveysparrow.com/u/frederike.freitag)\
**Post date:** [October 21, 2022, 8:21am UTC](https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819/1 "2022-10-21T08:21:44Z")

</div>

Hey there,

I don't have any experience with CSS but would love to style my survey in such a way that the text is placed on the left and the gif on the right.  
Currently, when inserting a gif, it always shows above or below the text. Would someone be able to help with this?

Thanks!

---

<div class="post-metadata">

**Author:** ![Wahab](https://dub1.discourse-cdn.com/flex013/user_avatar/community.surveysparrow.com/wahab/32/319_2.png) [@Wahab](https://community.surveysparrow.com/u/Wahab)\
**Post date:** [October 21, 2022, 12:07pm UTC](https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819/2 "2022-10-21T12:07:51Z")

</div>

Hey @frederike.freitag

Welcome to the SurveySparrow community 💎

Looping in my @SurveySparrow_Support team who will reach you and help you to sort this issue.

Feel free to reach us with any questions.

👋🏽

---

<div class="post-metadata">

**Author:** ![frederike.freitag](https://avatars.discourse-cdn.com/v4/letter/f/f08c70/32.png) [@frederike.freitag](https://community.surveysparrow.com/u/frederike.freitag)\
**Post date:** [October 24, 2022, 11:43am UTC](https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819/3 "2022-10-24T11:43:11Z")

</div>

That would be great! Thank you

---

<div class="post-metadata">

**Author:** ![Jayesh\_Urath](https://avatars.discourse-cdn.com/v4/letter/j/9e8a1a/32.png) [@Jayesh\_Urath](https://community.surveysparrow.com/u/Jayesh_Urath)\
**Post date:** [October 25, 2022, 12:50pm UTC](https://community.surveysparrow.com/t/how-to-place-gif-on-the-right-and-text-on-the-left/2819/4 "2022-10-25T12:50:07Z")

</div>

HI @frederike.freitag ,

Thanks for your patience

Below is the snippet to make the GIF on the right and text on the left, which applies only to the section-type question.

@media only screen and (min-width: 1100px) {  
.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn h1,  
.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn h3 {  
width: 46%;  
}

.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn\_right {  
max-width: 100%;  
position: relative;  
}

.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn h3 figure {  
width: 50%;  
right: 0;  
position: absolute;  
top: 0;  
transform: translate(0, -50%);  
}

.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn h3 figure img {  
width: 100%;  
}

.ss\_cl\_survey\_qstn\_item:not([data-qa-question-id]) .ss\_cl\_survey\_qstn h3 p:last-child {  
display: none;  
}  
}