Hello
@Melissa
Add following code to custom css
.Skin #SkinContent {
margin: 0 auto;
background-color: white;
}
Thanks so much!
Could you share how you add a background picture for the entire survey?
Thanks!
>
@JBM said:
> Could you share how you add a background picture for the entire survey?
> Thanks!
Paste the following css in the "Look and Feel" -> "Advanced" -> "Add custom css"
#SurveyEngineBody {
background: url('YOUR_IMAGE_URL');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.Skin #SkinContent {
background:none;
}
.Skin .SkinInner {
background: transparent !important;
}
Thank you! And is it possible to add a backrgound pic to one block of questions only?
>
@JBM said:
> Thank you! And is it possible to add a backrgound pic to one block of questions only?
Add the following code in the each question of block Or if you have multiple question on one page then paste the following code on only one question in js(onReady)
jQuery("#SurveyEngineBody").css({"background":"url('YOUR_IMAGE_URL')",
"background-size": "cover",
"background-repeat": "no-repeat",
" background-position": "center center"});
jQuery(".Skin #SkinContent").css({
"background":"none"
});
jQuery(".Skin .SkinInner").css("cssText","background : transparent !important");
>
@Shashi said:
> >
@JBM said:
> > Thank you! And is it possible to add a backrgound pic to one block of questions only?
>
> Add the following code in the each question of block Or if you have multiple question on one page then paste the following code on only one question in js(onReady)
>
> jQuery("#SurveyEngineBody").css({"background":"url('YOUR_IMAGE_URL')",
> "background-size": "cover",
> "background-repeat": "no-repeat",
> " background-position": "center center"});
>
> jQuery(".Skin #SkinContent").css({
> "background":"none"
> });
>
> jQuery(".Skin .SkinInner").css("cssText","background : transparent !important");
It doesn't seem to work... I am adding the code on the HTML box of the question. Here's what it looks like:
!
Hey
@JBM
Follow
this link and add in onReady function
>
@Shashi said:
> Hey
@JBM
>
> Follow
this link and add in onReady function
Ok it worked! 😀 But now we can't see the text on top of the pic:
!
Any solution to this? Maybe adding a white box to the question?
@Shashi , is there anyway to make the white box slightly taller and wider? I used the code you posted above, but now the white box stops right at the edge of the question which doesn't look right. So the corner of the next button meets up with the bottom right corner of the white box. I would like there to be some added white space between the NEXT button and where the white box ends.
Per Shashi's guidance, I added the code (below) to the custom CSS. However, the text of the questions is not black. The only way I have found to change the color is limited to the Foreground Contrast, where high results in white text in a white box, and low contrast results in grey text in a white box.
code added
.Skin #SkinContent {
margin: 0 auto;
background-color: white;
}
Hi! How do I get the question container for just one question to be transparent and keep the remainder of the survey to have a white question container? I’ve managed to get them all to have a white container using “Look and Feel” but have no idea how to get just one question to have a transparent question container.
