WordPress.org

Forums

Jetpack by WordPress.com
[resolved] Adjust width of contact form (7 posts)

  1. herz84
    Member
    Posted 1 year ago #

    Hi,

    Can I adjust the width of the contact form so I can put a picture next to it? Right now some fields of the form moves down to make room for the picture, but I want to decrease the width of the form (especially the type='select') so the picture will be outlined on the right of it.

    Website: http://patriciaverhagen.nl/wp-nieuw/contact/

    Thanks!

    http://wordpress.org/plugins/jetpack/

  2. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Can I adjust the width of the contact form so I can put a picture next to it?

    You can customize the look of the form (and other elements of your site) with custom CSS. Try adding the following CSS to your theme's stylesheet, or to your custom CSS editor available under Appearance > Edit CSS in your dashboard:

    #post-66 .contact-form {
    	float:left;
    	width: 50%;
    }

    I hope this helps.

  3. herz84
    Member
    Posted 1 year ago #

    This really helps, thanks! But can you explain me why the different fields in the form have different sizes? The name and email fields have the same width, the select-bar is wider and the comment box is again another width than the previous fields. Any idea how I can adjust that?

    Thanks!

  4. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    But can you explain me why the different fields in the form have different sizes?

    This will depend on the theme you're using. Luckily, you can adjust each element with CSS. For example, if you wanted all fields to have the same width:

    #post-66 .contact-form textarea,
    #post-66 .contact-form input[type='text'],
    #post-66 .contact-form input[type='email'] {
        width: 100%;
    }
  5. herz84
    Member
    Posted 1 year ago #

    Thanks, it looks wonderful :-).

  6. wak0511
    Member
    Posted 1 year ago #

    My filed headers are sitting over the fields a guest would use. What steps do I use to edit CSS? Simply just paste commands in there? I am beginner so I apologize the naive questions.

  7. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    @wak0511 Could you please start your own thread, as per the Forum Welcome?
    http://wordpress.org/support/plugin/jetpack#postform

    Thank you!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Jetpack by WordPress.com
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic