New Topic/Question
Reply
If I type something in my input box breaks into 2 lines, I can fix this with changing the width of the parent div but than my div isn't centered anymore.
images:
http://img39.imagesh...s/i/formhj.jpg/
http://img39.imagesh...i/formfire.jpg/
html:
<!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>
<title>Gen3</title>
<meta http-equiv="content-type" content="en-gb" />
<meta http-equiv="keywords" content="gen3, script" />
<meta http-equiv="description" content="This can be changed." />
<link href="themes/hamza/styles2.css" type="text/css" rel="stylesheet" />
<!--[if gte IE 7]>
<link href="themes/hamza/styles-ie.css" type="text/css" rel="stylesheet" />
<![endif]-->
<script type="text/javascript" src="http://localhost/ptc-hamza/themes/hamza/js/ads_pb.php"></script>
<script type="text/javascript" src="http://localhost/ptc-hamza/themes/hamza/js/principal2.js"></script>
<script type="text/javascript" src="http://localhost/ptc-hamza/themes/hamza/js/cb.js"></script>
<script type="text/javascript" src="themes/hamza/js/jquery-1.2.6.js"></script>
<script type="text/javascript" src="themes/hamza/js/menu-jq.js"></script>
<script language="javascript" type="text/javascript">
//<![CDATA[
var cot_loc0=(window.location.protocol == "https:")? "https://secure.comodo.com/trustlogo/javascript/cot.js" :
"http://www.trustlogo.com/trustlogo/javascript/cot.js";
document.writeln('<scr' + 'ipt language="Javascript" src="'+cot_loc0+'" type="text\/javascript">' + '<\/scr' + 'ipt>');
//]]>
</script>
</head>
<body>
<div id="container">
<div id="navigation">
<div>
<ul>
<li><a href="index.php">Home</a>
</li>
<li><a href="ads.php">Surf Ads</a></li>
<li><a href="adver.php">Advertise</a>
</li>
<li><a href="#">Support</a>
<ul>
<li><a href="forum/">Forum</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</li>
<li><a href="register.php">Register</a></li>
<li><a href="login.php" class="active">Login</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="logo"></div>
<div id="content">
<div class="head"><h1>Login</h1></div>
<div class="tbox">
<div class="left"></div>
<div class="back"></div>
<div class="right"></div>
</div>
<div class="inner login">
<div class="error"></div>
<div class="login_form">
<form action="" method="post">
<div><input type="hidden" name="token" value="3bafe4a82f268f9751597c7f131daeb370e4f86c" /></div>
<div><label>Username:</label> <input type="text" name="login_username" onfocus="text=this" value="" /></div>
<div><label>Password:</label> <input type="password" id="pwd" onfocus="text=this" name="login_password" /></div>
<div><label>Sec. Password:*</label> <input type="password" id="pwd2" onfocus="text=this" name="login_password2" /></div>
<div id="keyboard">
<div style="margin-left: 20px;"><a>1</a><a>2</a><a>3</a><a>4</a><a>5</a><a>6</a><a>7</a><a>8</a><a>9</a><a>0</a></div>
<div style="margin-left: 30px;"><a>q</a><a>w</a><a>e</a><a>r</a><a>t</a><a>y</a><a>u</a><a>i</a><a>o</a><a>p</a></div>
<div><a onclick="capital()" id="caps">Caps</a><a>a</a><a>s</a><a>d</a><a>f</a><a>g</a><a>h</a><a>i</a><a>j</a><a>k</a><a>l</a></div>
<div><a onclick="capital(1)" id="shift">Shift</a><a>z</a><a>x</a><a>c</a><a>v</a><a>b</a><a>h</a><a>n</a><a>m</a></div>
<div id="space"><a>space</a></div>
</div>
<p class="border"></p>
<div class="text">Enter the characters exactly as they appear</div>
<div class="captcha"><label></label><img src="image.php" width="120" height="36" alt="captcha" /> <input type="text" name="code" /></div>
<p class="border"></p>
<div><input type="hidden" name="7" value="" /></div>
<div class="buttons"><input type="submit" name="Login2" class="reply" value="Login" /> <a href="reset.php" class="bigbutton">Recover Password</a></div>
<div class="clear"></div>
</form>
</div>
<p class="border"></p>
<p class="info"><small>*You can enable the secondary password feature in the password settings.</small></p>
</div>
<div class="bbox">
<div class="left"></div>
<div class="back"></div>
<div class="right"></div>
</div><br />
</div>
<script type="text/javascript">
//<![CDATA[
var text;
var keyboard = document.getElementById('keyboard');
var a = keyboard.getElementsByTagName('a');
var caps = 0;
for(i=0; i<a.length-1; i++) {
if(a[i].innerHTML != "Caps" && a[i].innerHTML != "Shift") {
a[i].addEventListener('click', keyclick, false);
}
}
function keyclick(e) {
if(text==null) { text = document.getElementById('pwd'); }
if(e.target.innerHTML == "Space") {
text.value += " ";
}else {
if(caps > 0) {
text.value += e.target.innerHTML.toUpperCase();
}else {
text.value += e.target.innerHTML;
}
if(caps == 2) {
caps = 1;
capital();
}
}
}
function capital(shiftbut) {
if(caps == 1 || shiftbut == 0 || caps == 2) {
for(i=0; i<a.length-1; i++) {
a[i].style.textTransform = "lowercase";
}
caps = 0;
}else {
for(i=0; i<a.length-1; i++) {
a[i].style.textTransform = "uppercase";
}
caps = 1;
if(shiftbut == 1) { caps = 2; }
}
}
//]]>
</script>
<div id="foot">
<p class="fleft">© 2009 - 2010 Caerus International LTD</p>
<p class="fright"><a href="terms.php">Terms of Service</a> | <a href="privacy.php">Privacy</a> | <a href="news.php">News</a> | <a href="faq.php">FAQ</a></p>
</div>
</div>
<a href="http://www.instantssl.com" id="comodoTL">SSL</a>
<script language="Javascript" type="text/javascript">
COT("https://buxtro.com/cot_evssl.gif", "SC3", "none");
</script>
</body>
</html>
this is the css of that page
/* - Form - */
#content form label {
width: 135px; height: 26px;
display: inline-block;
color: #575757;
font-size: 15px;
vertical-align: middle;
}
#content form input, #content form textarea {
background: url(images/input_back.jpg) repeat-x;
width: 261px; height: 26px;
margin: 10px 0 20px 0; padding: 10px 0 0 9px;
border: 1px solid #dedede;
vertical-align: middle;
color: #6f6f6f;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
#content form input.bigbutton, #content form input.reply { height: 38px; padding: 0; border: 0; display: inline-block; cursor: pointer; }
#content form input.reply { width: 100px; margin-left: 10px; border-right: 1px solid #dedede; }
#content form textarea {
background: url(images/textarea_back.jpg) repeat-x;
height: 164px;
margin: -5px 0 0;
border: 1px solid #dedede;
vertical-align: top;
font-size: 13px;
line-height: 18px;
}
#content form .text, #content form .ftext { margin: 10px 0 0; text-align: center; font-size: 13px; }
#content form .ftext { margin: -10px 0 0; }
#content .captcha { margin: 10px 0 15px 0; }
#content .captcha img { border: 1px solid #dedede; vertical-align: middle; }
#content .captcha input { width: 85px; margin: 0 0 0 53px; }
#content .buttons { margin: 0 auto; }
#content .info { border-top: 1px solid #dedede; margin: 0 20px; padding: 25px 0 15px; text-align: center; }
#content .info small { font-size: 11px; }
/* - End Form - */
/* - Registration - */
#content .register .reg_form, #content .login .login_form { width: 535px; margin: 0 auto; }
#content .register .reg_form form a, #content .login .login_form form a { color: #575757; }
#content .register .reg_form p.border, #content .login .login_form p.border { margin-bottom: 20px; border-bottom: 1px solid #e5e5e5; }
#content .register .buttons { width: 240px; }
#content .register .terms, #content .login .terms { margin: 0 auto; width: 320px; }
#content .register .terms label,#content .login .terms .label { width: 275px; padding: 10px 0; vertical-align: top; }
/* - End Registration - */
/* - Login - */
/* See alos Registration */
#content .login .buttons { width: 305px; }
#content .login .buttons input { float: left; }
#content .login .buttons a.bigbutton { margin: 10px 0 0 10px; float: left; }
MultiQuote
| 
