...

View Full Version : How to align two buttons in different forms



camaross
07-25-2012, 01:41 AM
I need two buttons, one as the "Continue", which inside the first <form action="$SELF$" method=post></form>, so that I could collect information.

The next button is a "Go back" button, which is in another <form></form>.

Now my "Go back" button is always below the "continue" button, because the second form is below the first form.

What should I do to make the two buttons on a horizontal line?

Thanks.

tempz
07-25-2012, 09:37 AM
Like this?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
.search-form form, input{
display:inline;
padding: 0px 5px 0px 5px;
}
.search-form form{
border-bottom:1px solid #000;
text-align:center;
padding-bottom:4px;
width:7%;

display:inline;
}
.search-form{
width: 100%;

}

</style>
</head>

<body>
<div class="search-form">
<form action="$SELF$" method="post">
<input name="Button1" type="button" value="Continue..." />
</form>
<form style="width: 55px">
<input name="Button2" type="button" value="Go back?" /></form>

</div>

</body>

</html>

camaross
07-25-2012, 08:11 PM
Thank you very much for the example. I really appreciate the help!



Like this?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
.search-form form, input{
display:inline;
padding: 0px 5px 0px 5px;
}
.search-form form{
border-bottom:1px solid #000;
text-align:center;
padding-bottom:4px;
width:7%;

display:inline;
}
.search-form{
width: 100%;

}

</style>
</head>

<body>
<div class="search-form">
<form action="$SELF$" method="post">

<input name="Button1" type="button" value="Continue..." />
</form>
<form style="width: 55px">
<input name="Button2" type="button" value="Go back?" /></form>

</div>

</body>

</html>

camaross
07-25-2012, 08:42 PM
In the below example, how do I move the "continue" button after the "Go back" button. Considering that the "continue" button is related to a bunch of information within <table></table> (the information has to be displayed above the two buttons)


Thank you.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
.search-form form, input{
display:inline;
padding: 0px 5px 0px 5px;
}
.search-form form{
border-bottom:1px solid #000;
text-align:center;
padding-bottom:4px;
width:7%;

display:inline;
}
.search-form{
width: 100%;

}

</style>
</head>

<body>
<div class="search-form">
<form action="$SELF$" method="post">
<table>
<tr>
<td><b>Temperature of standardization:</b></td>
<td style="padding-left:30px"><b>Frequency of standardization:</b></td>
</tr>
<tr>
<td><input type="text" name="DICTAStdTemp0" value="$DICTAStdTemp0$" maxlength="45" style="width:294px;"/></td>
<td style="padding-left:30px"><input type="text" name="DICTAStdFre0" value="$DICTAStdFre0$" maxlength="45" style="width:294px;"/></td>
</tr>
</table>
<input name="Button1" type="button" value="Continue..." />
</form>
<form style="width: 55px">
<input name="Button2" type="button" value="Go back?" /></form>

</div>

</body>

</html>

tempz
07-25-2012, 10:35 PM
This?

http://i.imgur.com/4LRb7.jpg

camaross
07-28-2012, 02:58 AM
Exactly!!! So the second button "continue" is linked to the form above?

How did you do it? Thank you.





This?

http://i.imgur.com/4LRb7.jpg

tempz
07-28-2012, 06:35 PM
No wait, one second. i'll link it



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum