-
annefarleyAsked on November 14, 2017 at 8:38 PM
However can you explain how the CSS is built.
I have another form I want to do this with but can't understand the CSS that has been built.
I thought it would have to list the field id and then change the border\vertical spacing
This is the new form.
https://form.jotform.co/73117512979867
I want to change #input_30 #input_34 #input_35 #input_37 and the 4 rows below to look more like a table.
Is there a good guide you can recommended to help newbies to learn CSS
-
jonathanReplied on November 14, 2017 at 8:45 PM
First, you need to identify the field IDs and Names of the fields on the form.
User guide: How to Find Field IDs and Names
so that you can assign the CSS rules to those fields...
User guides:
How to Inject Custom CSS Codes
Customize Your Form Using Custom CSS Codes
Let us know if you need help on specific CSS codes on your form.
Thanks.
-
Anne FarleyReplied on November 15, 2017 at 11:51 PM
Yes can I please get some help on the specific CSS for the form.
I did already know how to find the field names but the reference material on the CSS doesn't show me what I want to do.
So if you could give me the specific CSS
I want to change #input_30 #input_34 #input_35 #input_37 and the 4 rows below to look more like a table.
Is there a good guide you can recommended to help newbies to learn CSS
That will help me learn how to do it better in the future.
-
Nik_CReplied on November 16, 2017 at 6:50 AM
We can only provide you with CSS that will line up those fields more in table-like view:
Here is the CSS to line them up like above:
input#input_34 {
margin-left: -60px;
}
input#input_38 {
margin-left: -60px;
}
input#input_43 {
margin-left: -60px;
}
input#input_47 {
margin-left: -60px;
}
input#input_51 {
margin-left: -60px;
}
label#label_34 {
margin-left: -60px;
}
input#input_35 {
margin-left: -60px;
}
input#input_39 {
margin-left: -60px;
}
input#input_44 {
margin-left: -60px;
}
input#input_48 {
margin-left: -60px;
}
input#input_52 {
margin-left: -60px;
}
label#label_35 {
margin-left: -60px;
}
input#input_37 {
margin-left: -60px;
}
input#input_40 {
margin-left: -60px;
}
input#input_45 {
margin-left: -60px;
}
input#input_49 {
margin-left: -60px;
}
input#input_53 {
margin-left: -60px;
}
label#label_37 {
margin-left: -60px;
}
I would advise you to check https://www.w3schools.com/css/ if you want to check more about CSS rules.
Let us know how it worked.
Thank you!