Connecting Tech Pros Worldwide Forums | Help | Site Map

How to align text label and input field's text ?

Yohan Blurp
Guest
 
Posts: n/a
#1: Jun 11 '07
Hi,

Here is sample page to show you the problem :

<html><body>
<form action="/cgi-bin/test.cgi" method="post">
Data Path : <input type="text" size="50" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF'></form>
</body></html>

I would like the text label and text in input field be exactly
vertically aligned in all main browsers : IE, Netscape, Firefox,
Mozilla, Opera, Konqueror, etc.

How to do ?


Jukka K. Korpela
Guest
 
Posts: n/a
#2: Jun 11 '07

re: How to align text label and input field's text ?


Scripsit Yohan Blurp:
Quote:
Here is sample page to show you the problem :
It's not a page. It's just a fragment of code. In future, please post a URL.
Quote:
<html><body>
<form action="/cgi-bin/test.cgi" method="post">
Data Path : <input type="text" size="50" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF'></form>
</body></html>
I wonder what you expect to achieve, in WWW terms, by using a text input
field initialized to something that looks like a path filename in a
particular computer. Moreover, a form without a submit button is not very
safe, and it looks odd. Besides, you should use <labelmarkup, for
accessibility, to associate the label text with the corresponding field.
Quote:
I would like the text label and text in input field be exactly
vertically aligned in all main browsers : IE, Netscape, Firefox,
Mozilla, Opera, Konqueror, etc.
That's not an HTML issue but a matter of styling (CSS). Besides, it's not
particularly important, and it's not really possible, due to the different
interpretations and implementations of the vertical-align property. But
_after_ you have created a functional page and tested it, feel free to ask
for ideas on styling in c.i.w.a.stylesheets.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Roy A.
Guest
 
Posts: n/a
#3: Jun 12 '07

re: How to align text label and input field's text ?


On 11 Jun, 12:10, Yohan Blurp <ybl...@aname.netwrote:
Quote:
Hi,
>
Here is sample page to show you the problem :
>
<html><body>
<form action="/cgi-bin/test.cgi" method="post">
Data Path : <input type="text" size="50" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF'></form>
</body></html>
>
I would like the text label and text in input field be exactly
vertically aligned in all main browsers : IE, Netscape, Firefox,
Mozilla, Opera, Konqueror, etc.
<form action="/cgi-bin/test.cgi" method="post">
<label for="x" style="vertical-align: middle">Data Path :</label>
<input type="text" size="50" name="x" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF; vertical-align: middle'>
</form>

Adrienne Boswell
Guest
 
Posts: n/a
#4: Jun 12 '07

re: How to align text label and input field's text ?


Gazing into my crystal ball I observed Yohan Blurp <yblurp@aname.net>
writing in news:MPG.20d73e044f4ae319989931@news.tiscali.fr:
Quote:
Hi,
>
Here is sample page to show you the problem :
>
><html><body>
><form action="/cgi-bin/test.cgi" method="post">
Data Path : <input type="text" size="50" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF'></form>
></body></html>
>
I would like the text label and text in input field be exactly
vertically aligned in all main browsers : IE, Netscape, Firefox,
Mozilla, Opera, Konqueror, etc.
>
How to do ?
>
Have a look at http://www.intraproducts.com/usenet/requiredform.asp


--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Yohan Blurp
Guest
 
Posts: n/a
#5: Jun 14 '07

re: How to align text label and input field's text ?


In article <1181614125.144506.96850@i38g2000prf.googlegroups. com>,
royarneskar@gmail.com says...
Quote:
<form action="/cgi-bin/test.cgi" method="post">
<label for="x" style="vertical-align: middle">Data Path :</label>
<input type="text" size="50" name="x" value="C:\Test Data\May
2007.xls" style='border: thin solid #FFFFFF; vertical-align: middle'>
</form>
>
Thanks, I've effectively used that
Yohan Blurp
Guest
 
Posts: n/a
#6: Jun 14 '07

re: How to align text label and input field's text ?


In article <4jhbi.176915$Qi2.98573@reader1.news.saunalahti.fi >,
jkorpela@cs.tut.fi says...
Quote:
I wonder what you expect to achieve, in WWW terms, by using a text input
field initialized to something that looks like a path filename in a
particular computer. Moreover, a form without a submit button is not very
safe, and it looks odd. Besides, you should use <labelmarkup, for
accessibility, to associate the label text with the corresponding field.
>
I've finally used <label>. However, because I didn't used <labelin the
past and, by that way, could know it was possible to apply a vertical-
align here, i could be aware of the fact the right group was about
stylesheet. When you ask a question you don't always know the domain of
solution !
Closed Thread