Contact Form 7 Widget – Adjust size of text boxes

  • Hello

    I just installed the Contact Form 7 Widget on my sidebar and am wondering if it is possible to adjust the size of the text input boxes so that they are not as wide. The default size overlaps with elements in the background image of the website.

    Let me know if you need additional information, this is my first website and I’m figuring out WordPress step by step as I go.

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

  • You can easily adjust the size with CSS stylesheet.

    Thread Starter pac311

    (@pac311)

    The CSS stylesheet for the plugin? Do you know which parameter I should be looking to adjust?

    Thread Starter pac311

    (@pac311)

    Oh! I just realized that you created the plugins, Takayuki! Thanks so much for your comment.

    I see that there is a CSS stylesheet for the Contact Form 7 plugin, but not for the Widget itself.

    Does that mean I can adjust the width of the widget via the CSS stylesheet for the Contact Form 7 plugin? Are you able to tell me specifically what I should adjust to change the width?

    Thank you so much for your help!

    You can edit Contact Form 7’s CSS, but it will be overwritten when you update the plugin. So I suggest you should add the styles to your active theme’s CSS, style.css.

    Thread Starter pac311

    (@pac311)

    Hello

    Sorry to keep asking questions, but when I make adjustments to
    contact-form-7/styles.css
    whether directly in the plugin or copying it over to my theme first, nothing changes.

    Can you tell me specifically what line I should be looking for in the stylesheet to control the width of the text input boxes that appear in the widget on my site’s sidebar?

    I am new to WordPress so the more specific you are, the more sense this will make to me.

    Thanks again

    Thread Starter pac311

    (@pac311)

    I’ve finally figured it out.

    Thanks

    That’s good.

    Then could you change this topic status to “resolved”? You’ll find the drop-down in the right sidebar.

    PAC311

    How did you adjust the text boxes?
    What is your site ?

    Could you please explain what line in the .css file you changed or what to look for?

    I too would like to change the width of the text box here:
    https://www.gabeatkinson.com/

    i am having the same issue, can someone please poit me in the right direction.

    My text boxes are not the same width either. The code is below, can someone help?

    [Code moderated as per the Forum Rules. Please use the pastebin]

    These are all CSS issues. Please post new topics that include a link to the page in question.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Contact Form 7 Widget – Adjust size of text boxes’ is closed to new replies.