Making small text boxes

Posted on 2009-02-23
Last Modified: 2012-05-06
I'm new to web development in general so I may be missing something simple.  I'm trying to create small text boxes, but if I do

<INPUT type="text" NAME="textbox" MAXLENGTH=5 SIZE=1>

it's about twice as long as I need it to be.  Is there a way to make it smaller by maybe setting the size by pixels or a percentage of the screen?
Question by:iwtblj247
    LVL 7

    Accepted Solution

    You need to add a bit of css to that. You need to define width, height and font-size:
    Play around with the code below:
    <INPUT type="text" NAME="textbox" MAXLENGTH=5 SIZE=1 style="width:30px;height:12px;font-size:10px;">

    Open in new window


    Author Closing Comment

    Worked great.  Thanks

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    Suggested Solutions

    Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
    Deprecated and Headed for the Dustbin By now, you have probably heard that some PHP features, while convenient, can also cause PHP security problems.  This article discusses one of those, called register_globals.  It is a thing you do not want.  …
    The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    758 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    7 Experts available now in Live!

    Get 1:1 Help Now