WordPress.org

Ready to get started?Download WordPress

Forums

Ninja Forms
[resolved] Changing the width of the form fields (10 posts)

  1. Puuma69
    Member
    Posted 1 year ago #

    Hello,could someone advice how to change the width of the the fprm fields? Now it is 940 px and liked to change to 240 px.

    http://wordpress.org/extend/plugins/ninja-forms/

  2. Kevin Stover
    The WP Ninjas
    Plugin Author

    Posted 1 year ago #

    Hey Puuuma,

    This would need to be done with some custom CSS styling. I'm not a CSS guru, but if you google it, you should be able to find information on changing textbox sizes in CSS.

  3. chiappa
    Member
    Posted 1 year ago #

    depends on which label alignment do you use. for example for textbox-label-adove:

    in ninja_forms_display.css

    .span-textbox-label-above {}
    	.span-textbox-label-above input {padding: 2px 5px; width: 97%;}
    	.span-textbox-label-above label {}

    change to:

    .span-textbox-label-above { width: 200px;}
    	.span-textbox-label-above input {padding: 2px 5px; width: 92%;}
    	.span-textbox-label-above label {}

    Voila.

  4. mrprewitt
    Member
    Posted 1 year ago #

    What if I wanted the label aligned to the left of the textbox, for instance?

    Also, when I view the .css file for the display, it says "(inactive)." How do I make it active?

    I am sorry if these are very simple things to do; I am extremely new to CSS.

  5. pikkabbu
    Member
    Posted 1 year ago #

    Hello !

    There's no such thing like `.span-textbox-label-above {}
    .span-textbox-label-above input {padding: 2px 5px; width: 97%;}
    .span-textbox-label-above label {}` in ninja-forms-display.css

    :-(

    I've defined a new class

    .short-field {
    width: 200px;
    }

    and indicated in the CSS class custom field of my textbox, but nothing happens.

    I can check with Chrome's page checking that class becomes
    class="ninja-forms-field ninja-forms-req short-field"
    but.... field remains full lenght.

    Any help please ?

  6. Kevin Stover
    The WP Ninjas
    Plugin Author

    Posted 1 year ago #

    Hi pikkabbu,

    I'm not really great at CSS, but if you send me a link to a page with the form you are trying to style, I'll take a look at it.

  7. James Laws
    The WP Ninjas
    Plugin Author

    Posted 1 year ago #

    Hi pikkabbu,

    I do all our css so as Kevin said post a link and I'd be happy to help. The issue is that Ninja Forms tries to add as little CSS as possible so that when goof theme designers create good design for dorm elements we don't override those styles. It is actually very easy to style Ninja Forms but admittedly only if you are fairly comfortable with CSS. If not it can be a little more difficult. especially if you theme has done odd things in it's styling choices.

    We are releasing a new extension on Monday that makes Ninja Forms super easy to style and I'll post the link here as soon as we launch it.

  8. pikkabbu
    Member
    Posted 1 year ago #

    Hi James,

    Thank you for your message.

    At this moment, I decided ti use another plugin, but I'll be happy to try the new version and give Ninja's another chance.

    We all must to appreciate creators that offer us free plugin to make our sites greater and better. (We all need to remember that donating is a great way to thank authors)

  9. pikkabbu
    Member
    Posted 1 year ago #

    Thank you Kevin !

    I use to manage rather well with CSS. The problem is that the plugin doesn't use the css I (we) add to its own css file.

    In fact, that's the 1st and only time this occurs to me.

    I do think that plugins are made to be used and their creations are aimed to user's application.

    So I don't understand well why some authors invest so much time and efforts creating very nice plugins and very few to let users use and enjoy them. ;-)

  10. James Laws
    The WP Ninjas
    Plugin Author

    Posted 1 year ago #

    We have just released the Layout & Styles Extension for Ninja Forms. Check it out and see if it will solve your problems or makes styling your forms so much easier.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags