Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 6, 2022 at 7:40 pm #1364112
    Samuel

    I would like to round the corners of the form fields and the submit button.

    I would also like to edit the font size of the form fields, form labels and the submit button.

    Can I have the CSS code? Thanks.

    • This topic was modified 2 years, 3 months ago by Samuel.
    September 6, 2022 at 7:48 pm #1364116
    Rikard

    Hey Samuel,

    Please try this in Quick CSS:

    #top .main_color .input-text, #top .main_color input[type='text'], #top .main_color input[type='input'], #top .main_color input[type='password'], #top .main_color input[type='email'], #top .main_color input[type='number'], #top .main_color input[type='url'], #top .main_color input[type='tel'], #top .main_color input[type='search'], #top .main_color textarea, #top .main_color select, .main_color input[type='submit'] {
    border-radius: 10px;
}

    Best regards,
    Rikard

    September 6, 2022 at 7:54 pm #1364120
    Samuel

    Thanks!

    What about editing the font size of the form fields, form labels and the submit button?

    September 6, 2022 at 8:28 pm #1364129
    Rikard

    Hi,

    Try this CSS as well:

    .main_color label {
  color: red; 
  font-size: 36px;
}

.main_color input[type='submit'] {
  color: blue; 
  font-size: 24px;
}

    Best regards,
    Rikard

    September 7, 2022 at 6:55 am #1364148
    Samuel

    The button size code works. The form label code didn’t work.

    September 7, 2022 at 7:55 am #1364164
    Samuel

    The input fields would look better if they were white. How do I change that? Thanks.

    September 7, 2022 at 7:57 am #1364165
    Ismael

    Hi,

    Thank you for the update.

    The css code for the label above should have worked. Please try this modified css again.

    .main_color .avia_ajax_form label {
    color: red;
}

    Do you mean the input placeholder?

    ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #909;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #909;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #909;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #909;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #909;
}

::placeholder { /* Most modern browsers support this now. */
   color:    #909;
}

    Based on: https://stackoverflow.com/questions/2610497/change-a-html5-inputs-placeholder-color-with-css

    Best regards,
    Ismael

    September 7, 2022 at 10:16 am #1364172
    Samuel

    It didn’t work. It’s okay, close the thread, I’ll revisit another time.

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Enfold Form Edits’ is closed to new replies.