PDA

View Full Version : IE and centering problems


kona72
05-30-2007, 02:14 AM
Hi All,

With the same css some pages center and some don't in IE

Here is page #1 that centers in Firefox but not in IE

See it live here!!

http://development.trafick.net/section1.php


<?php
include("include/admin_inc.php");
include("lib/class.phpmailer.php");

if($_REQUEST[l_flag]==1)
{
$sql="SELECT * FROM tbl_user WHERE username='".$_REQUEST[username]."' and pass='".$_REQUEST[pass]."'";
$result=mysql_query($sql);

if(mysql_num_rows($result)>0)
{
$row=mysql_fetch_array($result);
$_SESSION[user_id]=$row[user_id];
$_SESSION[user_logged_in]=true;

header("location:user_home.php");
exit;
}
else
{
$msg_1="This username/password doesnot exit. Please try again.";
}
}

if($_REQUEST[flag]==1)
{
$sql="SELECT count(*) as coun FROM tbl_user WHERE username='".$_REQUEST[username]."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);
if($row[coun]>0)
{
$msg="This username is already in use. Please choose another one.";
}
else
{
$password=RandomPassword(5);

$sql="INSERT INTO `tbl_user` ( `user_id` , `username` ,`pass`, `f_name` , `l_name` , `email` , `date_registered` , `status` ) VALUES ('', '".$_REQUEST[username]."', '".$password."','".$_REQUEST[f_name]."', '".$_REQUEST[l_name]."','".$_REQUEST[email]."', '".time()."', '0');";

mysql_query($sql) or die(mysql_error());

//Sending Email

$content="Dear ".$_REQUEST[f_name]." ".$_REQUEST[l_name].",<br>";
$content .="Your password is ::".$password;
$content .="<br>Thanks,<br>Administrator.";

$mail = new PHPMailer();
$mail->IsMail();
$mail->From = "curtis@trafick.net";
$mail->FromName = "Administrator";
$mail->AddAddress($_REQUEST[email],$_REQUEST[f_name]." ".$_REQUEST[l_name]);
$mail->IsHTML(true);
$mail->Subject = "Your Password";
$mail->Body = "$content";
$mail->AltBody = "$content";
$mail->Send();

header("location:section1.php?flag=2");
exit;
}
}

?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IMG Self Assessment Tool</title>
<link href="css/img.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="container">
<div id="banner">
<?php include("header.php"); ?></div><!-- end div banner-->
<div id="nav"><?php include("nav.php"); ?>
</div><!-- end div nav-->
<div id="content">
<p class="heading">Section 1 - Personal Information</p>
<p>&nbsp;</p>
<ul>
<li>Please choose an appropriate username that you will remember </li>
<li>Your secure password will be sent to you by email after completing the registration.</li>
<li>To initiate this process, please fill in your first and last names in the registration box followed by your email address.</li>
<li>Once you have your password you will be able to go directly to the 'Login' portion of this page.</li>
<li>For future visits, go directly to Box B (unless you have forgotten your password).</li>
</ul>
<?php
if($_REQUEST[flag]==2)
{
?>
<p align="center"><font color='#FF0000'><b>You have been successfully registered and your password has been emailed to the email address you have provided. Once, your account has been approved by the admin, you will be able to log into your account.</b></font></p>
<?php
}
?>
<?php
if(isset($msg) && $msg!='')
{
?>
<p align="center"><font color='#FF0000'><b><?php echo $msg; ?></b></font></p>
<?php
}
?>
<p>&nbsp;</p>
<script language='JavaScript' src='email_chk.js'></script>
<script language='JavaScript'>

function chk()
{
if(document.signup.username.value=='')
{
alert("Please enter your username.");
document.signup.username.focus();
return false;
}
if(document.signup.f_name.value=='')
{
alert("Please enter your first name.");
document.signup.f_name.focus();
return false;
}
if(document.signup.l_name.value=='')
{
alert("Please enter your last name.");
document.signup.l_name.focus();
return false;
}
if(document.signup.email.value=='')
{
alert("Please enter your email.");
document.signup.email.focus();
return false;
}
if(!checkEmail(document.signup.email.value))
{
document.signup.email.focus();
return false;
}
return true;
}

</script>
<form id="signup" name="signup" method="post" action="section1.php" onSubmit="return chk()">
<p class="heading">
<input name="flag" type="hidden" value="1">
Registration
</p>
<table width="450" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="39%">Username Name:</td>
<td width="61%"><input name="username" type="text" id="username" /></td>
</tr>
<tr>
<td width="39%">First Name:</td>
<td width="61%"><input name="f_name" type="text" id="f_name" value="<?php echo $_REQUEST[f_name]; ?>" /></td>
</tr>
<tr>
<td>Last Name: </td>
<td><input name="l_name" type="text" id="l_name" value="<?php echo $_REQUEST[l_name]; ?>" /></td>
</tr>
<tr>
<td>Email Address: </td>
<td><input name="email" type="text" id="email" value="<?php echo $_REQUEST[email]; ?>" /></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type="submit" name="Submit" value="Submit" /></td>
</tr>
</table>
</form>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p class="bold_text">If you already have a username and password please login below:</p>
<p>&nbsp;</p>
<?php
if(isset($msg_1) && $msg_1!='')
{
?>
<p align="center"><font color='#FF0000'><b><?php echo $msg_1; ?></b></font></p>
<?php
}
?>
<p><?php include("login.php");?></p>
</div>
<!-- end div content-->
<div id="footer">
<?php include("footer.php");?>
</div><!-- end div footer-->
</div><!-- end div container-->
</body>
</html>


Here is my CSS...


/*--------------------------------------------------------------------------------
IMG Stylesheet ---- Trafick IMS 2007
curtis@trafick.net - http://www.trafick.net

----Body and Boxes----------------------------------------------------------*/

*{
margin:0;
padding:0;
}
body {
background-color:#FFFFFF;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:11px;
}

table{
font-size:11px;
}

#container {
text-align: left;
margin: 0px auto;
background-image:url("../images/img_04.jpg");
padding: 0px;
width: 798px;
}

#banner {
height:123px;
}

#nav {
width: 758px;
background-image:url("../images/nav_bg.jpg");
font-size:12px;
padding: 0px 20px;
line-height: 41px;
}
#nav a:link{
color:#333333;
font-weight: bold;
}
#nav a:hover{
color:#006699;
font-weight: bold;
}
#nav a:active{
color:#333333;
font-weight: bold;
}
#nav a:visited{
color:#333333;
font-weight: bold;
}

#content {
width: 758px;
margin: 0px;
padding: 10px 20px;
}

#footer {
clear: both;
height:38px;
}

/*------Font Styles-----------------------------------------------------------*/

a:link {
color: #3F331D;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #3F331D;
}
a:hover {
text-decoration: none;
color: #006699;
}
a:active {
text-decoration: none;
color: #3F331D;
}

.bold_text {
font-weight: bold;
}

.footer_text {
font-size: 10px;
text-align: center;
}

.heading {
font-family:Georgia, "Times New Roman", Times, serif;
font-size: 15px;
font-weight: bold;
color: #336699;
padding: 10px 5px 5px;
width: auto;
border-bottom: thin dashed #336699;
}

ol{
padding:0px 0px 0px 60px;
}

ul{
padding:0px 0px 0px 60px;
}

li{
padding:0px 0px 0px 10px;
}

/*----------------------------Tables - Rows - Colums -----------------------*/

table{
padding:0px 0px 0px 40px;
}

td{
padding:7px;
text-align: left;
}



/*-------------Image display control -----------------------------------------------*/

.image_right {
float:right;

}

.image_left {
float:left;

}
table {
}
td {
border-bottom: thin dotted #006699;
border-right: thin dotted #006699;
height: 40px;
}

chriskq
05-30-2007, 10:41 AM
add a margin: 0 auto; to the body

maybe even text-align: center; (body aswel)??

davidj
05-30-2007, 11:50 AM
also here is a TIP

i see you have error messages in your code.

Try this method instead to keep your code all nice and tidy

create a blank page (with php tags) and call it errors.php

then add all your messages in that like this... (remember to comment)

define('warn01', 'This is a warning'); //<< warning for main page.php
define('warn02', 'This is another warning'); //<< warning for main page2.php
define('warn03', 'This is an error'); //<< warning for main page2.php


include the page to the pages you want to display errors

to call the errors just do this...

where you have this...

$msg_1="This username/password doesnot exit. Please try again.";

do this instead...


$msg_1 = warn03;


how tidy is that !!

it also lets you keep all the errors and warnings together so you can add to them when needed

domedia
05-30-2007, 12:52 PM
kona try the CSS tutorial we have on centering content.

Cary
05-31-2007, 12:11 AM
Hi All,

With the same css some pages center and some don't in IE


Your page needs to have a valid doctype to center in IE 6 with the styling you're using. As it is, your page is starting with the html tag and throwing IE 6 into quirks mode.

guitardave
06-01-2007, 03:07 AM
You could try this in your CSS.

Add this code below your original #container:

This will work for IE 7 and below.

*:first-child+html {} * html {} #container {
text-align: left;
background-image:url("../images/img_04.jpg");
padding: 0px;
left: 50%;
width: 798px;
margin-left: -399px;
}

kona72
06-02-2007, 03:06 PM
Wow... lot's o good stuff!!

David J

Try this method instead to keep your code all nice and tidy

create a blank page (with php tags) and call it errors.php

then add all your messages in that like this... (remember to comment)

Perfect! I'll give it a go!!

ChrisQ... this is the one that did it...

maybe even text-align: center; (body aswel)??