EndPreviousNextEnd EndPrint This TopicEnd

EnquiryForm.css

The Enquiry Form module will allow you to build an unlimited number of customised enquiry forms to suit your requirements. The module automatically ‘forwards’ enquiries to the relevant contacts within your organisation via email and can be setup to generate an automated email confirmation to your website customers.

 

1.The Enquiry Form layout uses the HTML <fieldset> Tag to layout labels and fields.
 

2.Default Templates use ID Selectors of #cLS and #cRS for Left-hand and Right-hand columns, which may be removed/updated to reflect your Templates.

 

3.If you encounter style clashes, check other module CSS for Class names and prefix the appropriate Class Selector for this module to differentiate it. For example MemberRegistration.css also uses "EnquiryLabel".
 

How to setup and manage this module? Use the Contegro Administration Console to access settings for this module. For example, adding a "Form Title" adding or removing "Form Fields", add a "Confirmation Message" and enable the "Captcha Control" for reducing spam.

 

 

Default Code

 

/* -----[ ENQUIRYFORM ]--------------------------------------------------------------------- */

 

.EnquiryForm:after {

 content: ".";

 display: block;

 height: 0;

 font-size: 0;

 clear: both;

 visibility: hidden;

}

.EnquiryForm {

 display: inline-block;

 width: auto;

 height: auto;

 clear: both;

 margin: 10px 0px;

 padding: 8px;

 border: 1px solid #999999;

 background: #FFFFFF;

}

/* Hides from IE Mac \*/

* html .EnquiryForm {

   height: 1%; }

.EnquiryForm {

   display: block; }

/* End hide from IE-mac */

 

         /* === [ Field Grouping ] === */

         .EnquiryLabelGroup {

                 display: block;

                 clear: both;

         }

 

                 /* === [ Checkbox | RadioButton Table ] === */

                 .CustomCheckbox,

                 .CustomRadio {

                         font-size: 1em;

                         margin: 0px 0px 4px 0px;

                         float: left;

                 }

                 .CustomCheckbox label,

                 .CustomRadio label {

                         padding: 0px 12px 0px 3px;

                 }

                 

                 .CustomCheckbox input {

                 }

 

/* === [ Border and Spacing ] === */

 

.EnquiryForm fieldset {

 position: relative;

 display: block;

 clear: both;

 padding: 10px;

 height: 1%;

}

         /* === [ Legend Text ] === */

         .EnquiryForm fieldset legend {

                 font-size: 1.2em;

                 color: #666666;

                 font-weight: bold;

                 margin: 0px 0px 8px -8px;

         }

 

         /* === [ Lable Text ] === */

         .EnquiryForm label.EnquiryLabel {

                 font-size: 1.2em;

                 position: relative;

                 display: block;

                 float: left;

                 width: 130px;

                 padding-right: 5px;

                 margin-bottom: 5px;

         }

         

         /* === [ Form Fields ] === */

         .EnquiryForm input, 

         .EnquiryForm select, 

         .EnquiryForm textarea {

                 position: relative;

                 display: inline;

                 margin-bottom: 2px;

         }

 

         /* === [ Error Text ] === */

         .EnquiryError {

                 position: relative;

                 display: inline-block;

                 clear: both;

                 font-size: 10px;

                 width: 250px;

         }

 

         /* === [ Button ] === */

         .EnquiryForm input.EnquiryButton {

                 position: relative;

                 display: block;

                 margin: 10px 0px;

         }

 

/* === [ CaptchaControl ] === */

.CaptchaControl {

 position: relative;

 display: block;

 clear: both;

 border-style: none;

 background: #FFFFFF;

 margin: 0px 0px 10px 0px; 

 font-size: 0.9em;

 padding: 10px 10px 3px 10px;                

}

.CaptchaControl .EnquiryError {

 position: relative;

 display: block;

 clear: both;

 font-size: 1em;

 float: none;

 margin: 0px 0px 10px 0px;

 color: #CC0000;

}

 

/* === [ Left Hand Container ] === */

#cLS .EnquiryForm {

}

/* === [ Field Grouping ] === */

#cLS .EnquiryLabelGroup {

}

 /* === [ Checkbox | RadioButton Table ] === */

 #cLS .CustomCheckbox,

 #cLS .CustomRadio {

         width: auto;

 }

 #cLS .CustomCheckbox label,

 #cLS .CustomRadio label {

         margin: 0px 0px 0px 0px;

 }

         /* === [ Border and Spacing ] === */

         #cLS .EnquiryForm fieldset {

                 border-style: none;

                 padding: 0px;

                 margin: 0px;

         }

         /* === [ Legend Text ] === */

         #cLS .EnquiryForm fieldset legend {

         }

         /* === [ Lable Text ] === */

         #cLS label.EnquiryLabel {

                 font-size: 1em;

                 padding-right: 0px;

                 margin-bottom: 0px;

         }

         /* === [ Form Fields ] === */

         #cLS .EnquiryForm input, 

         #cLS .EnquiryForm select, 

         #cLS .EnquiryForm textarea {

                 width: 200px;

         }

         #cLS .EnquiryForm .CustomCheckbox input,

         #cLS .EnquiryForm .CustomCheckbox select,

         #cLS .EnquiryForm .CustomCheckbox textarea {

                 vertical-align: middle;

                 width: auto;

         }

         #cLS .EnquiryForm .EnquiryButton input, 

         #cLS .EnquiryForm .EnquiryButton select, 

         #cLS .EnquiryForm .EnquiryButton textarea {

                 width: auto;

                 vertical-align: middle;

         }

         #cLS .EnquiryForm .FutureInfoCheckbox input {

                 width: auto;

                 vertical-align: middle;

         }

         /* === [ Error Text ] === */

         #cLS .EnquiryError {

         }

         /* === [ Button ] === */

         #cLS .EnquiryForm input.EnquiryButton {

                 margin: 10px 0px;

                 width: auto;

                 clear: both;

                 float: left;

         }

 

/* === [ Left Hand Container ] === */

#cRS .EnquiryForm {

}

/* === [ Field Grouping ] === */

#cRS .EnquiryLabelGroup {

}

 /* === [ Checkbox | RadioButton Table ] === */

 #cRS .CustomCheckbox,

 #cRS .CustomRadio {

         width: auto;

 }

 #cRS .CustomCheckbox label,

 #cRS .CustomRadio label {

         margin: 0px 0px 0px 0px;

 }

         /* === [ Border and Spacing ] === */

         #cRS .EnquiryForm fieldset {

                 border-style: none;

                 padding: 0px;

                 margin: 0px;

         }

         /* === [ Legend Text ] === */

         #cRS .EnquiryForm fieldset legend {

         }

         /* === [ Lable Text ] === */

         #cRS label.EnquiryLabel {

                 font-size: 1em;

                 padding-right: 0px;

                 margin-bottom: 0px;

         }

         /* === [ Form Fields ] === */

         #cRS .EnquiryForm input, 

         #cRS .EnquiryForm select, 

         #cRS .EnquiryForm textarea {

                 width: 200px;

         }

         #cRS .EnquiryForm .CustomCheckbox input,

         #cRS .EnquiryForm .CustomCheckbox select,

         #cRS .EnquiryForm .CustomCheckbox textarea {

                 vertical-align: middle;

                 width: auto;

         }

         #cRS .EnquiryForm .EnquiryButton input, 

         #cRS .EnquiryForm .EnquiryButton select, 

         #cRS .EnquiryForm .EnquiryButton textarea {

                 width: auto;

                 vertical-align: middle;

         }

         #cRS .EnquiryForm .FutureInfoCheckbox input {

                 width: auto;

                 vertical-align: middle;

         }

         /* === [ Error Text ] === */

         #cRS .EnquiryError {

         }

         /* === [ Button ] === */

         #cRS .EnquiryForm input.EnquiryButton {

                 margin: 10px 0px;

                 width: auto;

                 clear: both;

                 float: left;

         }

 

 

Default Images

 

button_submit Templates/_images/button_submit.gif

 

 

Contegro Core Example

 

Simple Enquiry Form with Captcha Control Showing

 

Enquiry Form

 

 

Topic Link