Avatar of dlcnet
dlcnetFlag for United Kingdom of Great Britain and Northern Ireland

asked on 

How to limit a input tag width when witdth is expressed in percent

Hi Experts!

I have the following code bellow. How one can limit the width of the input tag? I mean when I enter a larger text than the input size, at page refresh the input field accommodates the entire text instead of keeping its original width.
This is a server side application, this is why by refresh the input text comes back in the page input field.

Thanks!


<style type="text/css">

    table { width: 960px; }
    .g25 { width: 25%; }
    .g90 { width: 90%; }
</style>

<table>
    <tr>
        <td class="g25">Text</td>
        <td class="g25">
                <input type="text" class="g90" id="myText">
        </td>
    </tr>

</table>

Open in new window

CSS

Avatar of undefined
Last Comment
Hagay Mandel
Avatar of bartvd
bartvd
Flag of Netherlands image

You can directly accommodate the widht with javascript:

http://stackoverflow.com/questions/1288297/jquery-auto-size-text-input-not-textarea
ASKER CERTIFIED SOLUTION
Avatar of Hagay Mandel
Hagay Mandel
Flag of Israel image

Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
CSS
CSS

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.

43K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
Ask the experts
Read over 600 more reviews

TRUSTED BY

IBM logoIntel logoMicrosoft logoUbisoft logoSAP logo
Qualcomm logoCitrix Systems logoWorkday logoErnst & Young logo
High performer badgeUsers love us badge
LinkedIn logoFacebook logoX logoInstagram logoTikTok logoYouTube logo