Using CSS to add images to ninjaforms
0
I am trying to modify formatting with CSS in ninja forms. I would like to:
- Add an icon / image above each answer on radio button questions
- Allow users to click on that image or the text to select their answer
Can anyone help me with this code? I'm having trouble getting the images to display.
Thanks!
css ninja-forms
asked Jun 27 '18 at 4:46
user9997787user9997787
12
add a comment |
0
I am trying to modify formatting with CSS in ninja forms. I would like to:
- Add an icon / image above each answer on radio button questions
- Allow users to click on that image or the text to select their answer
Can anyone help me with this code? I'm having trouble getting the images to display.
Thanks!
css ninja-forms
asked Jun 27 '18 at 4:46
user9997787user9997787
12
2
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51
add a comment |
0
0
0
I am trying to modify formatting with CSS in ninja forms. I would like to:
- Add an icon / image above each answer on radio button questions
- Allow users to click on that image or the text to select their answer
Can anyone help me with this code? I'm having trouble getting the images to display.
Thanks!
css ninja-forms
asked Jun 27 '18 at 4:46
user9997787user9997787
12
I am trying to modify formatting with CSS in ninja forms. I would like to:
- Add an icon / image above each answer on radio button questions
- Allow users to click on that image or the text to select their answer
Can anyone help me with this code? I'm having trouble getting the images to display.
Thanks!
css ninja-forms
css ninja-forms
asked Jun 27 '18 at 4:46
user9997787user9997787
12
asked Jun 27 '18 at 4:46
user9997787user9997787
12
asked Jun 27 '18 at 4:46
user9997787user9997787
12
asked Jun 27 '18 at 4:46
user9997787user9997787
12
asked Jun 27 '18 at 4:46
user9997787user9997787
12
12
2
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51
add a comment |
2
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51
2
2
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51
add a comment |
2 Answers
2
active
oldest
votes
1
The easiest way I have found to place images in radio buttons is to do the following:
- Put and html image tag in the label section
<img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png">- this will simply put an image in the label section.
- if you want to have a text label as well, you can place it either before or after the image tag and edit it with CSS after. I usually do the following because it is quick and easy:
<div><img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png"><br>Button Label 1</div>
- Next, I add custom CSS to hide the typical radio circle button and create styles for image button selection:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
- The above CSS should display buttons like this:
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
add a comment |
0
I think this code can solve your problem
function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f51054696%2fusing-css-to-add-images-to-ninjaforms%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
The easiest way I have found to place images in radio buttons is to do the following:
- Put and html image tag in the label section
<img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png">- this will simply put an image in the label section.
- if you want to have a text label as well, you can place it either before or after the image tag and edit it with CSS after. I usually do the following because it is quick and easy:
<div><img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png"><br>Button Label 1</div>
- Next, I add custom CSS to hide the typical radio circle button and create styles for image button selection:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
- The above CSS should display buttons like this:
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
add a comment |
1
The easiest way I have found to place images in radio buttons is to do the following:
- Put and html image tag in the label section
<img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png">- this will simply put an image in the label section.
- if you want to have a text label as well, you can place it either before or after the image tag and edit it with CSS after. I usually do the following because it is quick and easy:
<div><img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png"><br>Button Label 1</div>
- Next, I add custom CSS to hide the typical radio circle button and create styles for image button selection:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
- The above CSS should display buttons like this:
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
add a comment |
1
1
1
The easiest way I have found to place images in radio buttons is to do the following:
- Put and html image tag in the label section
<img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png">- this will simply put an image in the label section.
- if you want to have a text label as well, you can place it either before or after the image tag and edit it with CSS after. I usually do the following because it is quick and easy:
<div><img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png"><br>Button Label 1</div>
- Next, I add custom CSS to hide the typical radio circle button and create styles for image button selection:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
- The above CSS should display buttons like this:
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
The easiest way I have found to place images in radio buttons is to do the following:
- Put and html image tag in the label section
<img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png">- this will simply put an image in the label section.
- if you want to have a text label as well, you can place it either before or after the image tag and edit it with CSS after. I usually do the following because it is quick and easy:
<div><img src="https://www.brothershelpingbrothers.org/wp-content/uploads/2015/08/silver-fire-button.png"><br>Button Label 1</div>
- Next, I add custom CSS to hide the typical radio circle button and create styles for image button selection:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
- The above CSS should display buttons like this:
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
/* NINJA FORM CSS */
/* Display image buttons inline */
li
display: inline-block !important;
/* Hide the radio button */
[type=radio]
position: absolute;
opacity: 0;
width: 0;
height: 0;
/* RADIO BUTTON STYLES */
/* Style radio button images */
label > div > img
cursor: pointer;
max-width: 100px !important;
max-height: 100px !important;
/* Style the text label */
label > div
color: blue;
font-size: .8em;
text-align: center !important;
/* CHECKED STYLES */
/* Outlines Selected Radio Button */
.nf-checked-label
outline: 3px solid pink;
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
answered Nov 16 '18 at 0:53
Ryan LafazanRyan Lafazan
465
465
add a comment |
add a comment |
0
I think this code can solve your problem
function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
add a comment |
0
I think this code can solve your problem
function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
add a comment |
0
0
0
I think this code can solve your problem
function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
I think this code can solve your problem
function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>function selectInput(id)
$("#" + id).prop("checked", true);
img
width: 50px;
height: 50px;
cursor: pointer;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio1')" />
<input id="radio1" type="radio" name="answer" value="Answer 1" />Answer 1
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio2')" />
<input id="radio2" type="radio" name="answer" value="Answer 2" />Answer 2
<img src="http://plainplastic.com/wp-content/uploads/2018/06/one-v2.png" onClick="selectInput('radio3')" />
<input id="radio3" type="radio" name="answer" value="Answer 3" />Answer 3
</div>answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
answered Jun 27 '18 at 6:17
Amin KamaliniaAmin Kamalinia
178118
178118
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
add a comment |
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
Thank you! In Ninja Forms, it turns out, you actually have to add the image into the label button, so typing the following into the label box worked. <img style="height:25px !important" class="imgquestions" src="plainplastic.com/wp-content/uploads/2018/06/one-v2.png" /> 1
– user9997787
Jul 5 '18 at 14:56
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f51054696%2fusing-css-to-add-images-to-ninjaforms%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
2
Please post whatever you have tried and be specific to a particular problem that you are facing.
– Saif Ur Rahman
Jun 27 '18 at 4:47
Sorry - I tried this: #nf-field-12-wrap .ninja-forms-field one background: url(plainplastic.com/wp-content/uploads/2018/06/one-v2.png); border: 0; width: 150px; height: 25px; */ #nf-field-field_ID-wrap .ninja-forms-field one
– user9997787
Jun 27 '18 at 4:51