Change background of Userform

  • Unknown's avatar
    cadernosesp · Member ·

    Hello! Im my website I add an userform, but it is not outstanding enouth. I want to change the background an other features of the userform using CSS. Can anyone help me?

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    hallluke · Member ·

    Here’s a really awful example that demonstrates how to change some of the colours and styles of your existing contact form. I’m sure you can think of some less horrendous colors for your site!

    form.contact-form input[type="text"],
form.contact-form input[type="email"],
form.contact-form textarea {
	border: 5px dashed #f00;
	background: #0ff044;
	font-size: 24px;
	font-size: 2.4rem;
	width: 500px;
}
form.contact-form label {
	color: #0ff;
}
form.contact-form label span {
	color: #00f;
}
  • Unknown's avatar
    cadernosesp · Member ·

    Thanks! It is exactly what I was looking for! I already changed my userform.

  • Unknown's avatar
    hallluke · Member ·

    Well that looks much better!

    If you want to expand the text comment area you can do so with something like this too:

    form.contact-form input.text {
	height:6em;
}
  • Unknown's avatar
    cadernosesp · Member ·

    After i copy the code, I try to edit the border of the fields. I find a lot of option in this site:
    http://www.w3schools.com/css/css_border.asp
    _______
    When I open my website by cellphone, I realized that tha userform do not update. It is normal? Thanks!

  • Unknown's avatar
    hallluke · Member ·

    It looks like you’ve selected the option to use the WordPress.com mobile theme which is called Minileven when the site detects a visitor is using a mobile phone. You can apply your CSS changes to the mobile theme via an option in the customiser.

    You shouldn’t need to change the code (although you might want to make the text smaller on mobile).

  • The topic ‘Change background of Userform’ is closed to new replies.