Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

text input type and 100%

Status
Not open for further replies.
vlitim

vlitim

Programmer
Sep 2, 2000
393
GB

I am using the below code for a textbox. Now exervything works fine the box expands to the width of the page, but when text is displayed in the box it stretches to the length of the text even if this is wider than the control it sits in?? I would have thought it would work the same was as a select box where if the text is longer it just doesn't show it!

<input style="width:100%" maxlength=255 type=text name=test value="">

help please!!

Cheers
Tim
 
Sort by date Sort by votes
Makes sense to me. It's expanding to 100% of the parent container. If there are no tags surrounding this tag, than it will take 100% of the body tag's width, which is expanded when you write the text in the text field.

Try wrapping this inside a div or other tag, and set an absolute with for this parent tag.

Example:

Code: 
<div style="width: 800px;">
<input style="width: 100%;" maxlength=255 type=text name="test" />
</div>

*cLFlaVA
----------------------------
"Holy crip he's a crapple!
 
Upvote 0 Downvote
yeah I have tried this and I get another problem. It now restricts the length of the textbox that you can see to the width you specify, but the page still scrolls horizontally as if the actual width of the input box is still the length of the text in it!!
 
Upvote 0 Downvote
Actually, maybe I don't even know what you're talking about. I couldn't duplicate the problem you claim with the following code:

Code: 
[blue]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd">[/URL][/blue]

<html>
<head>
<title>new document</title>

</head>

<body>
<form name="f">
  <input style="width: 100%;" type="text" name="t" />
</form>
</body>

</html>

It very well may be necessary that you need a complete doctype, which is above in blue.

*cLFlaVA
----------------------------
"Holy crip he's a crapple!
 
Upvote 0 Downvote
seems to happen if you put it in a table

Code: 
<table width=100%>
<tr><td>
  <input style="width: 100%;" type="text" name="t" value="why hello my name is tim what is going on here??! noone seems to know, how very strange" />
</td></tr>
</table>
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

cae154
  • Locked
  • Question
Body of email not appearing in correct font on iPhone and iPad
Replies
1
Views
820
spamjim
spamjim
lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
226
lmcate
lmcate
PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
697
PeDa
PeDa
waubain
  • Locked
  • Question
Prevent user from getting a 404 error if click on a hover text displaying a hidden image. 1
Replies
5
Views
264
jjgupta915
jjgupta915
coldbohemia
  • Locked
  • Question
I'm inserting a text file into a we
Replies
2
Views
185
coldbohemia
coldbohemia

Part and Inventory Search

Sponsor

Back
Top