Hi,
To align the labels at right, you only should press the “Form Settings” tab, from the form’s edition, and select the option “Right Aligned” in the “Label Placement” attribute.
To hide the border of the calculated fields boxes, you should use the style definition:
#fbuilder .codepeoplecalculatedfield { border:0; }
Finally, if you want that in the calculated fields the labels be aligned at top, you should follow the steps below:
1. Enter a custom class name through the “Add Css Layout Keywords” attribute, of the calculated field, for example myclass
2. Paste the following class definition in the css file:
.cp_cff_clean #fbuilder .myclass label,
.cp_cff_clean #fbuilder .myclass dfield{width:100% !important; text-align:left !important;}
Tip: You should clear the browser’s cache after modifiy the online files.
Best regards.
Thread Starter
UserDG
(@tenkepadu)
Where should I put this #fbuilder .codepeoplecalculatedfield { border:0; } ?
Thread Starter
UserDG
(@tenkepadu)
i cant center the input text field. I have this code .cp_cff_clean #fbuilder .hcresult input[type=”text”]{align:center;} but its not working
Hi,
The style definition ( #fbuilder .codepeoplecalculatedfield { border:0; } ) can be pasted in any CSS file loaded by your website, but to maintain the code organized, paste it at the end of the stylepublic.css file, located in “/wp-content/plugins/calculated-fields-form/css/stylepublic.css”
About the alignment of the input field at center, the correct style definition would be:
#fbuilder .hcresult .dfield{ text-align: center; }
Best regards.
Thread Starter
UserDG
(@tenkepadu)
I put these
#fbuilder .codepeoplecalculatedfield { border:0; }
#fbuilder .hcresult .dfield{ text-align: center; }
The border line is not remove, and the input text field is not center
Thread Starter
UserDG
(@tenkepadu)
I want to hide or remove the border and the white field in input text field
Hi,
In this case you can assign a custom class name through the “Add Css Layout Keywords” attribute, for example myclass, and define the myclass in any of the css file used by your website:
.myclass input{border:0;bakground:none;}
Best regards.
Thread Starter
UserDG
(@tenkepadu)
I did what you said but still its not working
#fbuilder .hcresult { border:0; }
#fbuilder .hcresult .dfield{ text-align: center; margin-left:70px; }
#fbuilder .resultfield {border:0;bakground:none;} //for the input background
The class name entered is applied to the <div> that includes the input. So, the style definition should be:
#fbuilder .resultfield input{border:0;background:none;}
Note: I’m sorry. in the previous ticket I’ve wrote “bakground” but the correct is “background”.
Best regards.
Hi,
You are not using the .resultfield class in the form, but I see your are using the “hcresult” class in the calculated fields, so, the correct would be:
#fbuilder .hcresult input{border:0;background:none;}
But if you want hide the borders and background colors in all calculated fields, the easiest way to get this is modifying directly the class assigned to the calculated fields:
#fbuilder .codepeoplecalculatedfield { border:0; background:none; }
Best regards.
Thread Starter
UserDG
(@tenkepadu)
Ok, I see. It’s ok now. But how I can change the font-color?
I put this code .cp_cff_clean #fbuilder .hcresult input{border:0;background:none; color:#FFFFFFF; font-size:20px;} but the font-color is not change into white color
Hi,
You are using seven characters in the color code, the correct are six:
#FFFFFF
Best regards.
Thread Starter
UserDG
(@tenkepadu)
I did that, but still not working
Hi,
Please, contact us through the support page:
http://wordpress.dwbooster.com/support
Best regards.
