Reduce the size of text fields in contact form?

  • Resolved picthechic

    (@picthechic)


    14 years, 6 months ago

    Website: https://www.kdesigns.ie

    Hi

    If you see the contact form on the right of the page you will see that the text fields spans further than the text box widget allows, I’ve been looking at the style.css to reduce the size but with no luck.

    If anyone would be kind enough to lend a hand here is the code i’ve been working with

    span.wpcf7-not-valid-tip {
	position: absolute;
	top: 20%;
	left: 20%;
	z-index: 100;
	background: #fff;
	border: 1px solid #ff0000;
	font-size: 10pt;
	width: 280px;
	padding: 2px;
}

Viewing 5 replies - 1 through 5 (of 5 total)

  • I’m pretty well guessing here…sorry, got no good tools handy

    .sidebar_right .wpcf7 {
        width: 60%;
       }

    targets the form as a whole, maybe mess with the width?

    or

    .sidebar_right .wpcf7 input {
        width: 60%;
        }

    should target just the boxes (may need to swap .wpcf7 for .wpcf7-form

    Thread Starter picthechic

    (@picthechic)

    Thanks

    i used the code

    .sidebar_right .wpcf7-form input {
        width: 60%;
        }

    This half did the trick ?? the text fields for name, email and subject are perfect but the text box for the message is still the same

    ??

    right, thats a text area box….

    .sidebar_right .wpcf7-form textarea {
        width: 60%;
        }

    sorry, forgot to mention that part

    Thread Starter picthechic

    (@picthechic)

    Brill!!

    Thats fixed that up and I learned a little bit more ??

    Thanks so much

    glad to help! and thanks for marking the thread as resolved! cool!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Reduce the size of text fields in contact form?’ is closed to new replies.