+1-888-365-2779
Try Now
More in this section

Form

4 posts, 0 answered
  1. Vishika
    Vishika avatar
    4 posts
    Registered:
    09 Jan 2014
    09 Jan 2014
    Link to this post
    Hello,
    I have already created a form and called it on a page but I can neither center it nor enlarged the text.  I have also add CSS to it,  but the latter is applied only to the header's part.  I want to modify the text boxes and format the submit button.  Can someone please help me.

    Thank You
    Vishika
  2. Sabrie Nedzhip
    Sabrie Nedzhip avatar
    534 posts
    Registered:
    09 Dec 2016
    14 Jan 2014
    Link to this post
    Hi Vishika,

    Could you please take a look at the following article from the Sitefinity documentation to get the list of CSS classes applied to forms widget. Then you can create a .css file in your project's folder and add your CSS styles. Here is an example:

    /*Input field of Textbox and Paragraph text box form widgets*/
    .sfTxt {
        width: 200px;
        height: 40px;
        border-radius: 6px;
        background-color: #dedede;
    }
     
    /* label wrappers */
    .sfLeftLbls, .sfRightLbls, .sfTopLbls {
        text-align: center;
    }
     
    /*Submit button*/
    input[type=submit] {
        background-color: #24ca23;
        color: white;
        width: 200px;
        height: 40px;
        border-radius: 6px;
    }
     
    /*Field label of Textbox, Multiple choice, Checkboxes,
        Paragraph text box, Dropdown list form widgets.*/
    .sfTxtLbl {
        font-size: 18px;
    }

    After writing the CSS you can drag the CSS widget to the page where the form is populated and click the Edit button of the CSS widget. Then please select the Link to a CSS file tab and select the CSS file you have just created. The styles should be applied as shown in the screenshot.

    Another option is to select the
    Write CSS tab and enter the CSS code in the textbox. In the following article you can find additional information on how to apply CSS styles to your page using the CSS widget. 

    If you have a custom theme applied to this page you can go to your theme and add CSS styling to your forms.

    Regards,
    Sabrie Nedzhip
    Telerik
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Markus
    Markus avatar
    2763 posts
    Registered:
    25 Nov 2005
    14 Jan 2014 in reply to Sabrie Nedzhip
    Link to this post
    Dear Sabrie 

    I think it could be helpfull if in every section of the .css documentaion there were a download link to the default theme .css so we could take this as a starting point.

    Markus
  4. Sabrie Nedzhip
    Sabrie Nedzhip avatar
    534 posts
    Registered:
    09 Dec 2016
    17 Jan 2014
    Link to this post
    Hi Markus,

    Thank you for the feedback. I have forwarded your suggestion to the Documentation team. For the time being you can download the Basic theme from your SDK installation folder/Content/Resources/BasicFrontendTheme.

    Regards,
    Sabrie Nedzhip
    Telerik
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
4 posts, 0 answered