Hi there.

I'm having some problem in aligning my captcha image on a form.

Here's the SS:

http://imageshack.us/photo/my-images/33/captchab.jpg

And here's my login code:

<html>
<title>Log In</title>
<style>
.singleBorder{
    border:1px #d6d6d6 solid;
    background-color:#f6f6f6;
}
.singleBorder td{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
    font-weight:bold;
    color:#333333;
}
.singleBorder input,select{
    border:1px #aaaacc solid;
    font-family:tahoma;
    font-size:12px;
    font-weight:normal;
    padding:2px;
    background-color:#FFFFFF;
}
.singleBorder input:focus{  /* doesn't work in IE 5,6 */
    border:1px #aaaacc solid;
    font-family:tahoma;
    font-size:12px;
    font-weight:normal;
    padding:2px;
    background-color:#FFFF99;
}
.points{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;
    color:#999999;
    font-weight:normal;
    padding:30px;
}
.formHeading{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:22px;
    font-weight:bold;
    color:#0066CC;
    padding:10px;
    text-shadow:#FF3333 .2em .2em .2em; 
}

</style>
</head>
<body>
<div id="contentWrapper">
    <table width="550px" border="0" cellpadding="2px" cellspacing="1px" align="center">
        <tr>
            <td width="2px"></td>
            <td>
                <div class="formHeading" align="center">Login Form</div>
                <table width="100%" border="0" cellpadding="3px" class="singleBorder" cellspacing="2">
                    <tr>
                        <td colspan="2">
                            <table width="100%">
                                <tr>
                                    <td>
                <div class="points" align="center">
                    <p style="font-weight:bold; color:#333333">
                    Please login first to continue using our service
                    </p>
                </div>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                             Username:
                        </td>
                        <td><input type="text" size="40" /></td>
                    </tr>
                    <tr>
                        <td align="right">
                            Password:
                        </td>
                        <td><input type="text" size="40" /></td>	
                    </tr>
					<br><br>
					

                    <tr>
					<td>
				
				<!----- CAPTCHA SECTION ------>
					<img src="captcha.php">
					</td>
					<tr>
                        <td align="right">
                         Verification Code:
                        </td>
                        <td><input type="text" size="40" /></td>
                    </tr>
                    <tr>
                       
                    <td></td>
                    </tr>
					
					<tr>
                    <td></td>
                    <td height="40">
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <input type="submit" name="Submit2" value="Log In">&nbsp;&nbsp;
                        <input value="Reset" class="btnbg" type="reset" action="login.php">&nbsp;&nbsp;&nbsp;
						<input value="Home"  type="submit" action="index.php">
						
				   </td>
                </tr>
					
                    
                      					
                        </td>
                   
                </table>
			<td>
            </td>
        </tr>
    </table>
	<br><br>


	
</body>
</html>

Tried putting center tag but doesn't work. Any idea?

Recommended Answers

All 6 Replies

CHANGE LINE NUMBER 89 FROM <TD> TO <td align="right">

Done, but still the same. Or should i edit it on the captcha php file?

if your image longer than the box (border you show), then i think you must change captcha php

I have tried editing the captcha file. but still wont get centered.. Running out of ideas here.

If you want to have it on the right side of your form:
the TD it is currently in, belongs to the left part.

So you could either put another empty cell before the captcha cell, or use colspan='2' and align='right' as values for your TD

Thanks, finally got it.

<td colspan='2'  align="center">
				
 <!--- CAPTCHA SECTION --->
	<img src="captcha.php">
					
</td>

Thanks guys.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.