...

View Full Version : Need Help with Firefox vs. IE formating (html)



RentMyCar
08-08-2010, 10:00 PM
I am having trouble getting a page in IE to look like the page in Firefox. Could you help?

Here is how it should look:

Firefox: http://www.rentmycar.com/?page=post_ad

What do I need to do to correct it?



(1) Here is the html page:


<!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">



<script language="JavaScript" src="js/forms.js"></script>




<head>

<meta name="alexaVerifyID" content="k6XsBOTRtcHPXwLfj_6MXP8iFug" />



<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>{SITE_TITLE}</title>

<link href="css/styles.css" rel="stylesheet" type="text/css" />


</head>

<body>

<!-- start header -->

<!--logo -->



<div id="wrapper">

<div id="header">

<div id="logo"><a href="http://rentmycar.com"><img src="images/logo.gif" width="368" height="101" alt="Rent My Car" border="0" /></a>
</div>

<!-- end logo -->




<div id="hd-rt">

<div id="hd-rt-top"> <!-- <img src="images/bookmarks.gif" width="151" height="30" alt="bookmarks" /> -->
</div>

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&amp;username=xa-4c00fd545a573b85" class="addthis_button_compact">Share</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_myspace"></a>
<a class="addthis_button_google"></a>
<a class="addthis_button_twitter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4c00fd545a573b85"></script>
<!-- AddThis Button END -->


<!-- tabs -->
<div id="hd-rt-bot">


<ul>
<li id="list"><a href="http://www.rentmycar.com/?page=post_ad">List</a></li>
<li id="rent"><a href="http://rentmycar.com/index.php?page=search">Rent</a></li>
<li id="insu"><a href="http://rentmycar.com/templates/insure.html">Insurance</a></li>
<li id="contract"><a href="http://www.rentmycar.com/templates/contract.html">Contract</a></li>
<li id="forum"><a href="http://www.rentmycar.net">Forum</a></li>

</ul>
</div>





</div>
</div>

<br>
<br>
<br>


<!-- start step 1 -->


<table cellspacing="4" cellpadding="4" width="100%" align="center" bgcolor="#FFFFFF" border="0">
<tbody>
<tr>
<td>
<table cellpadding="4">
<tbody>
<tr>
<td class="headline" valign="top" colspan="2">List: Step 1 of 2</td>
</tr>

<tr>
<td class="error">{ERRORS_STRING}</td>
</tr>

<tr>
<td valign="top" width="20%"></td>

<td valign="top" width="80%">
<form method="post">
{CAPTCHA} <b>Email:</b><br />
<input name="email" /><br />
<br />
<input type="radio" value="0" name="emailv" />Do not display my email<br />
<input type="radio" checked="checked" value="1" name="emailv" />Do not display my email but allow users<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;to contact me through the contact form<br />
<input type="radio" value="2" name="emailv" />Display my email on the site<br />
<br />
<!--
Password (for returning users only):<br><input name="password" size="20" type="password"><br><br>
If you already have one or more ads in our system,
please use the email you used last time and password you received by email message.
If you are new user, please remember the email and password you entered to
use our system in the future.<br><br>
-->Please note that you must enter valid email address, because you need to activate your ad by clicking on the link in the mail message.<br />
Your ad will expire in 45 days and will be removed from the ACTIVE listings to EXPIRED folder after 45 days.<br />
<br />
<strong>Category:</strong><br />
<select onchange="subcatchange(this)" name="catid">
</select><br />
<br />
<strong>Subcategory:</strong><br />
{SUBCATEGORY}<br />
<br />
<!--
<img src='/freecap/freecap.php' alt='captcha' id='freecap' class='i100'><br>
( Can't read it? <a href='javascript:document.getElementById("freecap").src="/freecap/freecap.php?"+Math.random();void(0)'>Click here!</a> )
<br>
Enter the word on the image: <br><input name=captcha size='20'><br>
--><input type="submit" value="Next" />
</form>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>





(2) Here is the php page:

"post-ad.php" contains the following: include "engine/pages/ad_step_1.php";

ad_step_1.php contains the following:




function generatePassword($length = 8)
{
$chars = 'abcdefghijkmnoprqstuvwxyzABCDEFGHIJKLMNPRQSTUVWXYZ23456789';
$numChars = strlen($chars);

$string = '';
for ($i = 0; $i < $length; $i++) {
$string .= substr($chars, rand(1, $numChars) - 1, 1);
}
return $string;
}

$q = q("SELECT id, name FROM cl_categories WHERE parent_id = '0' AND status = 0 ORDER BY relative_order ASC") or die(mysql_error());
// list all subcategories
$first=true;
while ($f = f($q)) {
//subcats
$sq = q("SELECT id, name FROM cl_categories WHERE parent_id = '{$f['id']}' AND status = 0 ORDER BY relative_order ASC") or die(mysql_error());
$subcats="";
$selected="";
while($sf=f($sq)) {
if($sf['id']==${"subcat".$catid}) {
$selected="selected";
$thissel="selected";
}
else {
$thissel="";
}
$subcats.="<option $thissel value='{$sf['id']}'>{$sf['name']}</option>\n";
}
if((($catid==0)&&$first)||($catid==$f['id'])) {
$selected="selected";
}
if(empty($selected)) {
$subcatdisplay="none";
}
else {
$subcatdisplay="block";
echo "<script type='text/javascript'>
oldsubcatdiv={$f['id']};
</script>";
}
$subcatid=$f['id'];
$category.="<option $selected value='{$f['id']}'>{$f['name']}</option>\n";
$subcategory .= parseVariables("templates/ad_step_1_row.html", 0);
$first=false;
}

$newuser="";
if (!empty($_POST)) {
$t = time();

$email=$_POST['email'];
$password=$_POST['password'];
if(empty($email)) {
$errors_string.="Your email is empty. Please enter valid email.";
}
else {
$memb=f(q("select id,password,username from cl_members where email like '$email'"));
if(($memb['id'])/*&&($memb['password']==$password)*/) {
//need to activate ad
$membid=$memb['id'];
$username=$memb['username'];
$password=$memb['password'];
}
else {
//need to create new user and activate ad
$password=generatePassword();
q("insert into cl_members (username,password,email,reg_date,status) values ('$email','$password','$email','$t','1')");
echo mysql_error();
$membid=mysql_insert_id();
$username="Q$membid";
q("update cl_members set username='$username' where id='$membid'");
}
}

$newuser="Your UserID is: $username\nPassword: $password\n";
$headers = 'From: '.$admin_mail.'\n';
mail($email,"rentmycar.com account details",$newuser);
if($membid) {
//log in user
setcookie("sAuth", $membid);
$sAuth = $membid;
$logged_in = 1;
//echo "Logged in $sAuth";
q("UPDATE cl_members SET last_login='".time()."' WHERE id='$membid'");

$pid=(int)$_POST['catid'];
$catid=(int)$_POST["subcat$pid"];
$emailv=(int)$_POST['emailv'];
$actcode=generatePassword(32);

q("INSERT INTO cl_ads (member_id, pid, catid, status, ad_modified,actcode,emailv) VALUES('$membid', '$pid', '$catid', '-1', '$t','$actcode','$emailv')");
$ad_id = mysql_insert_id();

q("INSERT INTO cl_ads_cat$pid (ad_id) VALUES('$ad_id')");
$ad_secondary_id = mysql_insert_id();

if($fMember[billing_plan_id] != 0) $bid = $fMember[billing_plan_id];
else
{
$bid = f(q("SELECT billing_plan_id FROM cl_categories WHERE id='$catid'"));
$bid = $bid[billing_plan_id];
}
q("INSERT INTO cl_ads_attributes (ad_id, member_id, billing_plan_id) VALUES('$ad_id', '$membid', '$bid')");
q("INSERT INTO cl_ads_fees (ad_id, member_id) VALUES('$ad_id', '$membid')");

$f = f(q("SELECT parent_id FROM cl_categories WHERE id='$catid'"));
$prev_catid = $f[parent_id];

session_destroy();

include "engine/pages/ad_step_2.php";
return;
}
}
parseVariables("templates/ad_step_1.html");
?>




(3) Here is the CSS page:


* { margin:0; padding:0; }


#wrapper { width:1037px; margin:0 auto; font-family:Arial, Helvetica, sans-serif; }

#header { width:1037px; height:101px; float:left; border-bottom:28px solid #098dce; }

#logo { width:368px; height:101px; float:left; }

#hd-rt { width:635px; height:101px; float:left; }

#hd-rt-top { width:151px; height:41px; margin:10px 20px 0 0; display:inline; float:left;}

#hd-rt-bot { width:900px; height:50px; float:left;}

#hd-rt-bot ul { float:left; margin:20px 0 0 20px; display:inline; }

#hd-rt-bot li { display:inline;}

#list
{ width:130px; height:27px; float:left; }

#list a
{ width:130px; height:27px; float:left; background:url(../images/list-menu.gif) no-repeat; text-indent:-9999px; }

#rent
{ width:130px; height:27px; float:left; }

#rent a
{ width:130px; height:27px; float:left; background:url(../images/rent-menu.gif) no-repeat; text-indent:-9999px; }

#insu
{ width:130px; height:27px; float:left; }

#insu a
{ width:130px; height:27px; float:left; background:url(../images/insu-menu.gif) no-repeat; text-indent:-9999px; }

#contract
{ width:130px; height:27px; float:left; }

#contract a
{ width:130px; height:27px; float:left; background:url(../images/contract-menu.gif) no-repeat; text-indent:-9999px; }

#forum { width:130px; height:27px; float:left; }

#forum a { width:130px; height:27px; float:left; background:url(../images/forum-menu.gif) no-repeat; text-indent:-9999px; }

#body
{ width:1037px; float:left; margin-top:10px; display:inline; }




.bd-lt-main { width:184px; float:left; }.bd-mid-main { width:588px; float:left; margin:0 22px; display:inline; border-left:1px solid #ccc; border-right:1px solid #ccc; }

.bd-rt-main { width:184px; float:right; }

.bd-lt-sub { width:184px; float:left; background:#fff;}.bd-lt-sub-top { width:184px; height:6px; float:left; }.bd-lt-sub-mid { width:169px; background:url(../images/bd-lt-mid.gif) repeat-y; float:left; padding-left:15px; padding-bottom:10px; }

.bd-lt-sub-bot { width:184px; height:6px; float:left; }

.info { height:20px; width:135px; float:left; background: rgb(145, 190, 255);
color: #1C0000; list-style-type:none; padding-left:15px; color:#000; font-weight:bold; }

.info2 { height:20px; width:75px; float:left; background:#0CF; border:1px solid #666; list-style-type:none; padding-left:15px; color:#000; font-weight:bold; }

.info3 { height:20px; width:50px; float:left; background:#0CF; border:1px solid #666; list-style-type:none; padding-left:15px; color:#000; font-weight:bold; }


.blank { height:20px; width:135px; float:left; background:#abaca3; border:1px solid #666; list-style-type:none; padding-left:15px; color:#000; font-weight:bold; }.blank-two { height:20px; width:150px; float:left; list-style-type:none; color:#000; font-weight:bold; display:inline; }.blank-two select { width:140px; float:left; }.blank-two input { width:70px; height:20px; float:left; margin-top:3px; display:inline; }.btn-search { width:52px; height:22px; float:left; margin:5px 0 0 5px; display:inline; }.bd-lt-sub-mid li { height:20px; width:135px; float:left; background:#e5e4e2; border:1px solid #666; list-style-type:none; padding-left:15px }.active { background:#0CF; }.bd-lt-sub-mid li a { color: #3937f2; text-decoration:none; font-weight:bold; }.new-york { width:150px; height:34px; float:left; display:inline; }.bd-lt-sub-two { width:150px; float:left; }.bd-lt-sub-two li { width:133px; float:left; background:#fff; height:20px; border:1px solid #89c9f8;2025f9 }.bd-lt-sub-two li a { color:#2025f9; width:133px; float:left; background:#fff; }.video { width:184px; padding-bottom:10px; margin-top:10px; display:inline; float:left; text-align:center; }.advertisement { width:184px; padding-bottom:10px; margin-top:10px; display:inline; float:left; text-align:center; }.bd-rt-sub-mid { width:169px; background:url(../images/bd-lt-mid.gif) repeat-y; float:left; padding-left:15px; padding-bottom:10px; }.car-rental { width:588px; height:26px; float:left; text-align:center; }.banner { width:588px; height:298px; float:left; text-align:center; margin-top:10px; display:inline; }.avai-rental { width:588px; height:28px; float:left; text-align:center; }.car-det-table { width:588px; float:left; font-size:16px; }#us-states { width:55px; float:left; }#us-states h2 { width:55px; line-height:25px; float:left; background:#8bcafd; color:#000; font-size:12px; text-align:center; }#us-states ul { width:55px; float:left; margin-top:10px; }#us-states li { width:55px; line-height:22px; float:left; list-style-type:none; }#us-states li a { color:#1017ff; text-decoration:none; }#countries ul { width:100px; float:left; margin-top:10px; }#countries li { width:100px; line-height:22px; float:left; list-style-type:none; }#countries li a { color:#1017ff; text-decoration:none; }#countries { width:100px; margin-left:5px; display:inline; float:left; }#countries h2 { width:100px; line-height:25px; float:left; background:#8bcafd; color:#000; font-size:12px; text-align:center; }#footer { width:1003px; height:45px; float:left; margin-top:20px; display:inline; font-size:10px; }#footer p { text-align:center; }#footer a { color:#666; text-decoration:none; }

}
.tmainmenu td.tmainmenu_gray {
border: 1px #ADADAD solid;
background: #E6E6E6;
color: #1C0000;
}

}
.tmainmenu td.tmainmenu_sgray {
border: 1px #ADADAD solid;
border-top: 1px #ffffff solid;
background: #ADADAD;
color: #1C0000;
}

.tmainmenu td.tmainmenu_blue {
border: 1px #ADADAD solid;
background: rgb(145, 190, 255);
color: #1C0000;
font-weight: bold;
}

abduraooft
08-09-2010, 09:22 AM
Fix the errors in your markup first, see http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.rentmycar.com%2F%3Fpage%3Dpost_ad

RentMyCar
08-10-2010, 08:49 PM
Fix the errors in your markup first, see http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.rentmycar.com%2F%3Fpage%3Dpost_ad

Thank you for the link. I will start there and report back.

RentMyCar
08-15-2010, 02:42 AM
Fix the errors in your markup first, see http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.rentmycar.com%2F%3Fpage%3Dpost_ad

OK. The page has been corrected and it is passing validation.

http://validator.w3.org/check?uri=rentmycar.com%2Ftemplates%2Fad_step_1_repair.html&charset=%28detect+automatically%29&doctype=Inline&group=0&user-agent=W3C_Validator%2F1.1


Can you help me correct how the page looks in IE. I need it to look like the page in Firefox. In IE, the body is shifting to the left.

http://rentmycar.com/templates/ad_step_1_repair.html

phpdeveloper
08-15-2010, 06:37 AM
You need to create one more css for only IE its called IE Css hack and add into your html code like below.

<!--[if IE]> <link href="ie_only.css" rel="stylesheet" type="text/css"> <![endif]-->

SB65
08-15-2010, 10:49 AM
No reason at all for IE specific code. It's not centred in IE because your doctype is incomplete. Replace this:


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

with this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

and give that a go.

RentMyCar
08-16-2010, 01:19 AM
No reason at all for IE specific code. It's not centred in IE because your doctype is incomplete. Replace this:


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

with this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

and give that a go.



Your suggestion did NOT work after I uploaded the page to the file location "ad_step_1_html". The page causes only 3 validation errors now. Some other page reading into it is causing the problem. There is a "headermini.html" when removed causes 13 validation errors. If you look at the code source, you will see that there are two <head>

If anyone has any suggestions, it will help.

RentMyCar
08-16-2010, 01:30 AM
No reason at all for IE specific code. It's not centred in IE because your doctype is incomplete. Replace this:


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

with this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

and give that a go.


BTW. would you be interested in some paying code work?

RentMyCar
08-16-2010, 03:40 AM
I have been able to figure this out.....I just took the header code source from the ad_step_1.html page and placed it in the "headermini.html" page. It corrected the appearance in IE. Thus, it was a header problem due to the conflict between those two files.

I only need to repair the two remaining validation errors on http://www.rentmycar.com/?page=post_ad

RentMyCar
08-16-2010, 04:43 AM
RESOLVED!

The original problem here with formatting has been resolved. It was the header problem. The header needed to be moved into another file named "headermini.html". :D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum