88828 - Input fields are displaced from visible locations

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[adam.bruce]

From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; WinNT4.0; en-US; rv:0.9.2) Gecko/20010628
BuildID:    2001062815

On the UK national rail enquiry timetable, the form fields do not align with the
visible form entry field 'windows'

Go to http://www.railtrack.co.uk/ and click on "Timetable for UK Rail I
nformation" for link to page. The form is totally screwed!

Reproducible: Always
Steps to Reproduce:
1.Go to http://www.railtrack.co.uk/ and click on "Timetable for UK Rail
Information" for link to page. The form is totally screwed!
2.
3.

Actual Results:  Field (defaults) are displaced above input field locations on
page, overlaying text.

Expected Results:  Display the input field to the enquiry form form properly!

<html><head><title>Railtrack Travel Timetable</title>
<script language=JavaScript>
<!-- Hide script from old browsers
//
var isMac = false;
function Macdetect() {
if (navigator.appVersion.indexOf("Macintosh") > 0) {
isMac = true;
}
else  {
isMac = false;
}
}
Macdetect();
//
var cookieIsSet=false;
var dateNow=new Date();
var allcookies = unescape(document.cookie);
var pos = allcookies.indexOf("RAILTRACKSTATIONS=");
var currentValue;
var commasFound=0;
var firstComma=0;
var secondComma=0;
var Name="";
var StartStation="";
var EndStation="";
var EndOfString=0;
if (pos !=-1 && isMac==false) { //if there is a railtrackuserstations cookie
pos=pos+18;
for(i=pos;i<allcookies.length;i++){
//
currentValue=document.forms[0].years_at_current.value.charAt(i);
currentValue=allcookies.charAt(i);
if(currentValue==";")
if (EndOfString == 0)
EndOfString=i //ie : find the position of the ";" char
}
if (EndOfString == 0) //this means that there is no ';' at the end of the cookie
string
EndOfString=allcookies.length;
for (i=pos;i<EndOfString;i++){
currentValue=allcookies.charAt(i);
if (currentValue==",") 	{
if (commasFound==0) {
firstComma=i;
commasFound=1;
}
else if (commasFound ==1 ) {
secondComma=i;
commasFound=2;
}
}
}
Name = ReplacePlus(allcookies.substring(pos,firstComma));
StartStation=ReplacePlus(allcookies.substring(firstComma+1,secondComma));
EndStation=ReplacePlus(allcookies.substring(secondComma+1,EndOfString));
}
else {
Name="";
StartStation="";
EndStation="";
}
function ReplacePlus(Str){
var outStr="";
for (i=0;i<Str.length;i++){
currentValue=Str.charAt(i);
if (currentValue=="+")
outStr=outStr+" ";
else outStr=outStr+currentValue;
}
return outStr;
}
function fillValues(){
if (document.formular.from.value.length)
{
if (document.formular.from.value.length < 1){
document.formular.from.value=StartStation;
}
if (document.formular.to.value.length < 1){
document.formular.to.value=EndStation;
}
}
var dateString;
var timeString;
if (dateNow.getHours() <10)
timeString = "0"+dateNow.getHours() ;
else timeString = dateNow.getHours() ;
if (dateNow.getMinutes() < 10)
timeString=timeString + ":"+"0"+dateNow.getMinutes();
else timeString = timeString+":"+dateNow.getMinutes();
if (dateNow.getDate() < 10)
dateString="0"+dateNow.getDate()+"/";
else dateString=dateNow.getDate()+"/";
if ((dateNow.getMonth()+1) < 10 )
dateString=dateString+"0"+(dateNow.getMonth()+1)
else dateString=dateString+(dateNow.getMonth()+1)
if (document.formular.date.value.length < 1){
document.formular.date.value=dateString;
}
if (document.formular.time.value.length < 1){
document.formular.time.value=timeString;
}
}
// End hiding script from old browsers -->
</script>
</head>
<body background="/img/sn_back.gif" ALT="Background image" bgColor=#ffffff
vlink=yellow alink=yellow leftMargin=0 onload=fillValues(); topMargin=0
MARGINHEIGHT="0" MARGINWIDTH="0">
<table border=0 cellPadding=0 cellSpacing=0 width=580>
<tbody>
<tr>
<td width=159></td>
<td width=128></td>
<td width=128></td>
<td width=180></td></tr>
<tr>
<td align=left vAlign=top><img alt=RAILTRACK border=0 height=22
src="/img/navmenu_rtlogo.gif" width=158>
<td colSpan=3>
</td>
<tbody>
<tr>
<a href="http://www.railtrack.co.uk" target=_top><img alt="Railtrack Home"
border="0"
><img src="/img/rt_home_button2.gif" border="1"></a>
</td>
<tr>
<td colSpan=2 Width=293></td>
<td colSpan=2 vAlign=bottom><a
</TD></tr></tbody></table>
<br> <br>
<form ACTION="http://212.87.65.227/bin/query.exe/en" NAME=formular METHOD="POST">
<input TYPE=HIDDEN NAME=protocol VALUE="http:">
<center>
<br>
<!--TJ logo-->
<img src="/img/replacement.gif" alt="Welcome to TotalJourney" border="0">
</a>
<a href="http://www.nationalrail.co.uk/news/fs_news.htm" target=_top><img
src="/img/strike_banner260601.gif" border="0"></a></center>
<table>
<tr>
<td>&nbsp;</td>
<td><b class="travel">starting station</b>
<td><td COLSPAN=3>
<input TYPE=TEXT NAME="from" VALUE="">
<tr>
<td><br>
</a><br><td>
<b class="travel">destination station:</b>
</td>
<td><td COLSPAN=3>
<input TYPE=TEXT NAME="to" VALUE="">
<td>
<tr>
<td rowspan="3" width="200"><br>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="2"><img border="0" src="/img/nothing.gif" width="10" height="10"><a
href="http://www.kizoom.co.uk/railtrack/kizoom_info.html"><img border="0"
src="http://www.railtrack.co.uk/kizoom/railtrack/images/k_phone.gif" alt="Click
here for more information" width="20" height="45"></a></td>
<td><a href="http://www.kizoom.co.uk/railtrack/kizoom_info.html"><img border="0"
src="http://www.railtrack.co.uk/kizoom/railtrack/images/k_mobile.gif" alt="Click
here for more information" width="83" height="26"></a></td>
</tr>
<tr>
<td><a href="http://www.railtrack.co.uk/wap"><img border="0"
src="http://www.railtrack.co.uk/kizoom/railtrack/images/k_login.gif" alt="Login
Now" width="83" height="19"></a></td>
</tr>
</table><br><br><img border="0" src="/img/nothing.gif" width="5">
<a
href="http://www.railtrack.co.uk/travel/developer/index.html"><img alt="site
developers" border=0
src="/img/site_dev.gif" width="87" height="17"></a>
</td>
<td><b class="travel">via station</b>&nbsp;(optional): </td>
<td><td COLSPAN=3>
<input TYPE=TEXT NAME="via.1" VALUE="">
<tr>
<td>
<b class="travel">date of travel</b>
<td><input TYPE=RADIO NAME="datesel" VALUE="custom" CHECKED>
<td><input TYPE=TEXT NAME="date" SIZE="11" VALUE="02.07.01">
<td><input TYPE=RADIO NAME="datesel" VALUE="tomorrow"> tomorrow
<tr>
<td ALIGN=TOP>
<b class="travel">time of travel</b>
<td><td>
<input TYPE=TEXT NAME="time" VALUE="17:30" SIZE="11">
<td><input TYPE=RADIO NAME="timesel" VALUE="depart" CHECKED> Departure
<td><input TYPE=RADIO NAME="timesel" VALUE="arrive"> Arrival
<tr>
<td ALIGN="TOP"></td>
<td ALIGN=TOP>
<b class="travel">
Limit Changes
</b>
</td>
<td>
</td>
<td>
<select NAME="max_changes">
<option VALUE="-1">Unlimited Changes
<option VALUE="0">No Changes (0)
<option VALUE="1">One change (1)
<option VALUE="2">Two changes (2)
</select>
</td>
</tr>
</table>
</table>
<center><table CELLPADDING="2">
<tr>
<td><input alt="submit"
src="/img/butt_submit.gif" border="0" height="22"width="73" type="image"
value="search" ></td>
</tr>
</table>
<table>
<tr>
<td ALIGN=CENTER>
<br>
<b> Please ensure you confirm your journey details by calling National Rail
enquiries
on 08457 48 49 50.</b>
</td>
</tr>
</table>
</form>
</center>
<hr>
<table BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH="100%">
<tr>
<td ALIGN=LEFT VALIGN=TOP>
<em>
&copy; Railtrack 02.07.01
</em>
</td>
</table>
</body>
</html>

Comment 1

[David Einstein]

This is yet another missing reflow problem. I dont think that this is a dup, but
there are a bunch of missing reflow bugs.  Resizing the window fixes things.

Comment 2

[jim-patterson]

Here is another example, which most people will actually be able to access from
their browser:

http://www.dslreports.com/forgot

Comment 3

[rods (gone)]

Seems to look ok now