Shifting Control button

[shaunk]

The following code controls the visibility of a page foward and page back button. If on the first round, then the back button is not visible. If on the last round, the forward button is not visible. This works. But in both cases when the other button is not visible, the visible button left or right justifies itself, meaning the user has to shift cursor position. Can't spot the problem. Thanks.

<TABLE border=0 cellSpacing=0 width= "100%" >

<!-- Start of Page Back block -->
<tr><td align="right" colspan=3 > 
<Div id="PageBack" style="<% setstyle("B") %>">
<form id= "frmPageBack" name = "frmPageBack" method="post" action="Footy_Tips_Browse_Entries.asp" >
<input id="txtPageBack" type=hidden name="txtPageBack" value="Y" >
<input id = "cmdPageBack" name="cmdPageBack" type = "reset" value="<<<<" onclick="frmPageBack.submit()" > &nbsp;&nbsp;
</form></Div></td>
<!-- End of Page Back block -->

<!-- Start of Page Foward block -->
<td align="left" colspan=2 > 
<Div id="PageFoward" style="<% setstyle("F") %>">
<form id= "frmPageFoward" name = "frmPageFoward" method="post" action="Footy_Tips_Browse_Entries.asp" >	
<input id="txtPageFoward" type=hidden name="txtPageFoward" value="Y" >
<input id = "cmdPageFoward" name="cmdPageFoward" 
type = "reset" value=">>>>" 
style="font-size:3mm; font-family: Arial; color:red" onclick="frmPageFoward.submit()" >
</form></Div></td></tr>
<!-- End of Page Foward block -->

<% Public Function setstyle(B) 
	If B = "B" then If roundvar = 1 then response.write("display:none") else response.write("display:block") end if 
	If B = "F" then If roundvar = 26 then response.write("display:none") else response.write("display:block") end if 
	End Function
%>

</table>
</center>

 

[Vragabond]

You are aligning one to the left and the other one to the right. What did you expect to have happened?

 

[ChrisHunt]

Change it to

<TABLE border=1

and you'll see what's going on - the table cells are being resized when one cell is empty and the other one has visible content. You've also got some [tt]colspan[/tt] attributes that don't seem to be doing anything useful. Removing them and explicitly setting the cell width should fix it:

<td style="width:50%" align="left">

Incidentally, why are you using Javascript to turn a reset button into a submit button? Why not just use a submit button in the first place?

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[tsdragon]

Instead of using the "display" attribute, use the "hidden" attribute. The button will not display, but it will still take up the same amount of space, keeping your buttons aligned the way you want them.


Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.