• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 302
  • Last Modified:

amend html code

Hi, im just trying to align buttons to the right with a form but the form moves downwards below the button, id like it to stay center the same height as the button, ive been trying the code below but I cant get it to work, any help id appreciate, thanks

<div>
<p><a href="manage_budgets.jsp"><img border=0 height=32 src="images/button.gif" width=105 img></a></p>
<div id=Layer1 style="HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border=0 height=32 src="images/button.gif" width=105 img></a></p>
<div id=Layer1 style="HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<body>
<center><img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg"></center>
<br>
<div align="center">
<form name="Form1" method="post" action="makeuser.jsp">
<table>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
0
Ronayne
Asked:
Ronayne
  • 4
  • 4
1 Solution
 
brunoCommented:
why do you ahve a body tag in the middle of your code?

can you post your full code?
0
 
COBOLdinosaurCommented:
Needs a validator for a start I think.

Cd&
0
 
RonayneAuthor Commented:

I ran it through a validator and got this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content=
"HTML Tidy for Windows (vers 1st July 2003), see www.w3.org">
<title>Enter your Details</title>
</head>
<body>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<center><img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg"></center>
<br>
<div align="center">
<form name="Form1" method="post" action="makeuser.jsp">
<table>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Forename</b></font></td>
<td align="right"><input type="text" name="forename"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Surname</b></font></td>
<td align="right"><input type="text" name="surname"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Password</b></font></td>
<td><input type="password" name="password"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Re - Enter Password</b></font></td>
<td><input type="password" name="secondpassword"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Department</b></font></td>
<td><input type="text" name="department"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Phone Number</b></font></td>
<td align="right"><input type="text" name="phone"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter e - mail</b></font></td>
<td align="right"><input type="text" name="email"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5"><input type=
"submit" value=" Register"></font></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</form>
<table border="0" cellpadding="0" cellspacing="0" bgcolor=
"#FFFFFF"></table>
</div>
</div>
</div>
</body>
</html>
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
brunoCommented:
something like this?







<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content=
"HTML Tidy for Windows (vers 1st July 2003), see www.w3.org">
<title>Enter your Details</title>
</head>
<body>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<br>
<div align="center" style="float: right; position: absolute; top: 0px; left: 200px;">
<img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg">
<form name="Form1" method="post" action="makeuser.jsp">
<table border="1">
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Forename</b></font></td>
<td align="right"><input type="text" name="forename"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Surname</b></font></td>
<td align="right"><input type="text" name="surname"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Password</b></font></td>
<td><input type="password" name="password"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Re - Enter Password</b></font></td>
<td><input type="password" name="secondpassword"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Department</b></font></td>
<td><input type="text" name="department"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter Phone Number</b></font></td>
<td align="right"><input type="text" name="phone"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter e - mail</b></font></td>
<td align="right"><input type="text" name="email"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5"><input type=
"submit" value=" Register"></font></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</form>
<table border="0" cellpadding="0" cellspacing="0" bgcolor=
"#FFFFFF"></table>
</div>
</div>
</div>
</body>
</html>
0
 
RonayneAuthor Commented:
Sorry, this is the file I want amended, apologies... its basically the same

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

 <SCRIPT LANGUAGE="JavaScript">
<!--

function getuser()
{
     var fname=document.forms[0].forename.value;
     var sname=document.forms[0].surname.value;
     document.forms[0].username.value=sname.charAt(0)+fname;
}

//-->
</SCRIPT>

html>
<head>
<meta name="generator" content=
"HTML Tidy for Windows (vers 1st July 2003), see www.w3.org">
<title>Enter your Details</title>
</head>
<body>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<br>
<div align="center" style="float: right; position: absolute; top: 0px; left: 200px;">
<img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg">
<form name="Form1" method="post" action="makeuser.jsp">

<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Forename</b></font></td>
<td align="right"><input type="text" name="forename"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Surname</b></font></td>
<td align="right"><input type="text" name="surname" onblur="getuser()"><br>
</td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>User(Login)Name</b></font></td>
<td align="right"><input type="text" name="username"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Password</b></font></td>
<td><input type="password" name="password"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Re - Enter Password</b></font></td>
<td><input type="password" name="secondpassword"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Department</b></font></td>
<td><input type="text" name="department"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Phone Number</b></font></td>
<td align="right"><input type="text" name="phone"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>e - mail</b></font></td>
<td align="right"><input type="text" name="email"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5"><input type=
"submit" value=" Register"></font></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</form>
<table border="0" cellpadding="0" cellspacing="0" bgcolor=
"#FFFFFF"></table>
</div>
</body>
</html>
0
 
RonayneAuthor Commented:
im happy with this, I just to bring down the center jpeg down a few <br>'s. Ive tried using <br> but it brings the buttons down. Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

 <SCRIPT LANGUAGE="JavaScript">
<!--

function getuser()
{
     var fname=document.forms[0].forename.value;
     var sname=document.forms[0].surname.value;
     document.forms[0].username.value=fname.charAt(0)+sname;
}

//-->
</SCRIPT>

<html>
<head>
<meta name="generator" content="HTML Tidy for Windows (vers 1st July 2003), see www.w3.org">
<title>Enter your Details</title>
</head>
<body>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<br>
<div align="center" style="float: right; position: absolute; top: 0px; left: 200px;">
<center><img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg"></center>
<br>
<div align="center">
<form name="Form1" method="post" action="makeuser.jsp">
<table>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Forename</b></font></td>
<td align="right"><input type="text" name="forename"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Surname</b></font></td>
<td align="right"><input type="text" name="surname"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>User(Login)Name</b></font></td>
<td align="right"><input type="text" name="username"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Password</b></font></td>
<td><input type="password" name="password"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Re - Enter Password</b></font></td>
<td><input type="password" name="secondpassword"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Department</b></font></td>
<td><input type="text" name="department"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Phone Number</b></font></td>
<td align="right"><input type="text" name="phone"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>e - mail</b></font></td>
<td align="right"><input type="text" name="email"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5"><input type=
"submit" value=" Register"></font></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</form>
<table border="0" cellpadding="0" cellspacing="0" bgcolor=
"#FFFFFF"></table>
</div>
</body>
</html>
</div>
</div>
</div>
0
 
brunoCommented:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

 <SCRIPT LANGUAGE="JavaScript">
<!--

function getuser()
{
     var fname=document.forms[0].forename.value;
     var sname=document.forms[0].surname.value;
     document.forms[0].username.value=fname.charAt(0)+sname;
}

//-->
</SCRIPT>

<html>
<head>
<meta name="generator" content="HTML Tidy for Windows (vers 1st July 2003), see www.w3.org">
<title>Enter your Details</title>
</head>
<body>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<div>
<p><a href="manage_budgets.jsp"><img border="0" height="32" src=
"images/button.gif" width="105" img=""></a></p>
<div id="Layer1" style=
"HEIGHT: 244px; LEFT: 71px; POSITION: absolute; TOP: 213px; WIDTH: 137px; Z-INDEX: 1">
</div>
<br>
<div align="center" style="float: right; position: absolute; top: 40px; left: 200px;">
<center><img align="center" img="" border="1" src=
"http://localhost:8080/seanproj/images/newuserentdetails.jpg"></center>
<br>
<div align="center">
<form name="Form1" method="post" action="makeuser.jsp">
<table>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Enter I.D</b></font></td>
<td align="right"><input type="text" name="idnum"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Forename</b></font></td>
<td align="right"><input type="text" name="forename"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Surname</b></font></td>
<td align="right"><input type="text" name="surname"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>User(Login)Name</b></font></td>
<td align="right"><input type="text" name="username"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Password</b></font></td>
<td><input type="password" name="password"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Re - Enter Password</b></font></td>
<td><input type="password" name="secondpassword"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Department</b></font></td>
<td><input type="text" name="department"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>Phone Number</b></font></td>
<td align="right"><input type="text" name="phone"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5" color=
"#000000"><b>e - mail</b></font></td>
<td align="right"><input type="text" name="email"><br></td>
</tr>
<tr>
<td align="right"><font face="Arial Narrow" size="5"><input type=
"submit" value=" Register"></font></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</form>
<table border="0" cellpadding="0" cellspacing="0" bgcolor=
"#FFFFFF"></table>
</div>
</body>
</html>
</div>
</div>
</div>
0
 
RonayneAuthor Commented:

Thanks a million, could you just point out where you brought down the center image?
0
 
brunoCommented:
<div align="center" style="float: right; position: absolute; top: 40px; left: 200px;">


because it's absolutely positioned, i brought it down 40 pixels from the top of the screen.  you can change that number to see how it is affected.


bruno
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now