# CSS to customize built-in contact form?

**URL:** <https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187>\
**Category:** RapidWeaver Classic\
**Created:** [October 10, 2016, 1:01pm UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187 "2016-10-10T13:01:53Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tapdance42](https://avatars.discourse-cdn.com/v4/letter/t/8797f3/32.png) [@Tapdance42](https://forums.realmacsoftware.com/u/Tapdance42)\
**Post date:** [October 10, 2016, 1:01pm UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187/1 "2016-10-10T13:01:53Z")

</div>

I’m using a very simple version of the built-in contact form, just a few fields for contact info and a message. The form works perfectly, but I’d like to make some adjustments to the look of the page.

How do I adjust the width of the input fields (right now they run off the sides of the page) and change the size/color of the text? I’ve played around with the CSS but can only figure out how to change the top line of text. I’m guessing there are easy fixes for both of these, but I can’t seem to figure it out!

Here’s the form as it looks at the moment:  
[http://www.becky-frey.com/contact/contact-form/index.php](http://www.becky-frey.com/contact/contact-form/index.php)

---

<div class="post-metadata">

**Author:** ![robbeattie](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/robbeattie/32/78_2.png) [@robbeattie](https://forums.realmacsoftware.com/u/robbeattie)\
**Post date:** [October 12, 2016, 6:33am UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187/2 "2016-10-12T06:33:52Z")

</div>

I don’t have the theme but it’s obviously possible because they do it in the demo project.

Have you tried downloading the tutorial project from [here](http://archetypon.net/themes/estiasis/index.html) to see if that helps?

Rob

---

<div class="post-metadata">

**Author:** ![kryten](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/kryten/32/5313_2.png) [@kryten](https://forums.realmacsoftware.com/u/kryten)\
**Post date:** [October 12, 2016, 6:57am UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187/3 "2016-10-12T06:57:36Z")

</div>

@Tapdance42

I don’t have the theme either and I would always recommend using theme/vendor provided customisations **before** resorting to custom CSS.

But… if you can’t find any, you could try adding this CSS to the page level CSS container. Maybe it will get the form closer to your liking?

```
form.rw-contact-form {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

label {
    font-size: 1em;
    color: white;
}

.message-text {
    text-align: center;
    text-transform: uppercase;
    font-size: 1.2em;
}
```

---

<div class="post-metadata">

**Author:** ![Tapdance42](https://avatars.discourse-cdn.com/v4/letter/t/8797f3/32.png) [@Tapdance42](https://forums.realmacsoftware.com/u/Tapdance42)\
**Post date:** [October 12, 2016, 11:44am UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187/4 "2016-10-12T11:44:09Z")

</div>

This CSS worked perfectly, and the contact form now looks exactly as I want it to look. Thank you so much!!!

---

<div class="post-metadata">

**Author:** ![kryten](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/kryten/32/5313_2.png) [@kryten](https://forums.realmacsoftware.com/u/kryten)\
**Post date:** [October 12, 2016, 10:24pm UTC](https://forums.realmacsoftware.com/t/css-to-customize-built-in-contact-form/10187/5 "2016-10-12T22:24:15Z")

</div>

My pleasure entirely.  
Greetings from yuzoolthemes!  
[http://www.yuzoolthemes.com/](http://www.yuzoolthemes.com/)