PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Change width of Name field

  1. lucasgrav
    Member

    Hello,

    Is there any way to change the width of the Name field? I need it to be 300px. Any help?

    Looked all over the forums and documentation and no good.

    Thanks.

    -Lucas

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  2. In your instance, add this:

    [css]
    #field_1_1 {
    width: 300px;
    }

    Each field has it's own ID, so you can style them however you'd like with each selector. I highly recommend checking out Firebug for FireFox or using Google Chrome Developer Tools to inspect your page and find the ID's and classes that you would need to target appropriately. That should help you out here.

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  3. lucasgrav
    Member

    Thank you Rob. Sorry for all these questions I've been asking. I'm new at this.

    Regards,

    -Lucas

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  4. No problem Lucas, we're here for ya. I think those free tools above will make your life a lot easier. That's how we are able to pinpoint and identify what you should be targeting.

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  5. lucasgrav
    Member

    Hmm... Doesn't seem to work. I used the firebug and looked for the ID of the first name, which is 1_1_3 and the last name is 1_1_2.

    Because I need the first name field 200px and the last name field 300px. Am I doing something wrong?

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  6. Sometimes, you will need to use !important to override other styles, in this case you will need to set a width on the outer li and then set the two input IDs individually in conjunction with the !important tag so it overrides the width: 95% coming from our stylesheet:

    [css]
    #field_1_1 {
    width: 520px;
    }
    #input_1_1_3 {
    width: 200px !important;
    }
    #input_1_1_6 {
    width: 300px !important;
    }
    Posted 12 years ago on Friday January 27, 2012 | Permalink
  7. lucasgrav
    Member

    Thanks Rob! Worked this time. Thanks for you time, too.

    By the way, is there anything that teaches you what the !important rule is? For the future.

    Again, thanks.

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  8. lucasgrav
    Member

    One more question, on my site, http://173.254.15.37/nwtm/ The blue space between the first name and the last name, right in between them, how do I reduce the space?

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  9. You would just change the width value of #field_1_1 to be smaller in width.

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  10. Richard Vav
    Administrator

    Lucas, if you want to learn more about CSS you might want to check out the w3schools website where there are tutorials for the various web development techs including HTML and CSS
    http://www.w3schools.com/

    Richard

    Posted 12 years ago on Friday January 27, 2012 | Permalink
  11. lucasgrav
    Member

    Thanks Rob.
    Thanks Richard.

    Posted 12 years ago on Friday January 27, 2012 | Permalink

This topic has been resolved and has been closed to new replies.