/    Sign up×
Community /Pin to ProfileBookmark

Trying to match width in pixels to textbox size

Hi all

I have a div that appears directly below a text box. When the user clicks on an item in the div, i place it in the textbox. I want the width of both the textbox and the div to be that of the largest item in the div.

However, setting the textbox to have the same width of the div will not show all the characters of the selected text. I assume this is because of differences between pixel width and the input size property.

Any ideas how i can get these to match?

Thanks

to post a comment
JavaScript

2 Comments(s)

Copy linkTweet thisAlerts:
@JerailJan 18.2010 — I'd be interested in anything anyone has to say on this topic, as well. I've been playing around with it a bit. Not sure if this directly applies, but you might be interested in looking at something I've been working on.

[url=http://jerail.ca/fun/multicolor/]DIV and textarea side-by-side[/url]

[url=http://jerail.ca/fun/syntax/1.html]Hidden textarea[/url]
Copy linkTweet thisAlerts:
@rnd_meJan 18.2010 — textareas use cols, not size to adjust width.

note that if you apply a pixel width to a textarea, the cols value is ignored.

if you have trouble fittent the text, try a smaller or more horizontally compact font.

you can also try different white-space css settings for the textarea, and see if that helps.

textareas don't like to break lines and wrap, but i think you can force them to with a certain setting.

i'm not 100% sure what you want to do, so if none of this helps, post a link or some code, and i'll see what i can do for you.
×

Success!

Help @crazy_coder spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...