Web Hosting Talk






PDA

View Full Version : [help] With HTML+CSS compatibility to IE6

Butbul
07-09-2007, 10:16 AM
Okay, i have few problems with compatibility to IE6,
*This code work really fine with IE7 and FF
HTML CODE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="he">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title><?=$titleme;?></title>
<script type="text/javascript" src="drop.js"></script>
<link href="drop.css" rel="stylesheet" type="text/css" />
<link href="content.css" rel="stylesheet" type="text/css" />
<META NAME="Generator" CONTENT="<?=$titleme;?>">
<META NAME="Author" CONTENT="Nadav Butbul">
<META NAME="Keywords" CONTENT="<?=$keyme;?>">
<META NAME="Description" CONTENT="<?=$descme;?>">
<SCRIPT LANGUAGE="JavaScript">
function popUpme(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=760,height=500,left = 132,top = 134');");
}
</script>
</head>
<SCRIPT LANGUAGE="JavaScript">


function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=490,height=280,left = 267,top = 244');");
}

</script>

<style>
body{direction:rtl;}
</style>
<BODY <?=$feed;?>><center>
<!-- The first div :) -->

<table cellspacing="0" cellpadding="0">
<tr>
<td style="text-align:right;background-image:url('bar.jpg');width:200px;height:auto;">
<a href="index.php"><img src="logo.jpg" alt="" /></a>
</td>
<td style="background-image:url('bar.jpg');width:460px;height:auto;vertical-align:top;">
<div class="support">
מענה טלפוני 24/7 08-6650566
<div class="button" align="right">
<a href="page.php?id=15">יצירת קשר</a> • <a href="http://forum.wserv.co.il/he/">פורומים</a> • <a href="blog/">בלוג</a>
</div>
</td>
<td style="background-image:url('bar.jpg');width:100px;height:auto;">
<form action="setLanguage.php" method="post" name="language">
<select onchange="javascript:document.language.submit();">
<option selected>עברית</option>
<option>English</option>
</select>
</form>
</td>
</tr>
</table>

<div class="topmenu" style="vertical-align:middle;">
<table class="menu">
<tr>
<td><a href="index.php">דף ראשי</a> | <br></td>
<td onmouseover="showHideTable('home')" onmouseout="showHideTable('home')">
<a href="page.php?id=1">מוצרים</a><br>
<div class="menu" id="home">
<a href="content.php?id=2">דואר אלקטרוני</a><br>
<a href="content.php?id=3">אחסון לינוקס</a><br>
<a href="content.php?id=4">אחסון ווינדוס</a><br>
<a href="content.php?id=5">אחסון רייסלר לינוקס</a><br>
<a href="content.php?id=6">אחסון רייסלר ווינדוס</a><br>
<a href="content.php?id=7">שרת VPS לינוקס</a><br>
<a href="content.php?id=8">שרת VPS ווינדוס</a><br>
<a href="content.php?id=9">שרתים ייעודים</a><br>
</div>
</td></td>
<td>
&nbsp;| <a href="content.php?id=10">דומיינים</a> | <br>
</td>
<td>
<a href="content.php?id=11">שותפים עסקיים</a> | <br>
</td>
<td>
<a href="content.php?id=12">תמיכה טכנית</a> | <br>
</td>
<td>
<a href="page.php?id=13">הזמנות ושירות</a> | <br>
</td>
<td onmouseover="showHideTable('About')" onmouseout="showHideTable('About')">
<a href="page.php?id=14">אודות</a><br />
<div class="menu" id="About">
<a href="page.php?id=15">צור קשר</a><br>
<a href="page.php?id=26">אחריות שביעות רצון</a><br>
<a href="page.php?id=16">חוות שרתים ותשתיות</a><br>
<a href="page.php?id=27">מדיניות נגד דואר זבל</a>&nbsp;&nbsp;<br>
<a href="content.php?id=18">משרות דרושים</a><br>
<a href="page.php?id=19">צוות ווינר סרב</a><br>
<a href="blog/">בלוג</a><br>
<a href="content.php?id=22">מפת האתר</a>
</div>
</td>
</tr>
</table>
</div>

<!-- End spacing and start News menu -->

<div class="newsmenu"><div style="direction:rtl;"><b>
x
</b></div></div>

<!-- News menu end -->

<!-- Flash start -->
<div class="spacex">
&nbsp;
</div>
<div class="linewithtwo">
<div class="toptitle">
<?=$title;?>
<div class="spacex" style="font-size:10px;">
&nbsp;
</div>
<div class="textarea" style="direction:rtl;color:black;text-align:right;">
<?=$butbul;?>(<a href="javascript:popUp('recomment.php?url=page.php?id=<?=$id;?>')">המלץ לחבר</a>)
<br /><br />
<?=$text;?>
</div>
</div>
<!-- Flash end -->
<!-- Start whois domain box -->
<form method="post" action="whois.php">
<div class="domainbox">
<div class="domaintext">

<select size="1" name="ext">
<option selected value="com">com.</option>
<option value="net">net.</option>
<option value="org">org.</option>
<option value="info">info.</option>
<option value="biz">biz.</option>
<option value="name">name.</option>
<option value="us">us.</option>
<option value="ws">ws.</option>
<option value="co.il">co.il.</option>
<option value="org.il">org.il.</option>
</select>
<input type="text" name="domain" size="15">
</div>
<div class="domainspace">&nbsp;</div>
<input type="hidden" name="option" value="check">
<div><input type="submit" name="submit" class="dosearch" value="בצע חיפוש דומיין" /></div>
<div class="domainspacer">&nbsp;</div>
<!-- Ads -->
<div class="domainads"><img src="imgs\10.jpg" alt="מבצע החודש דומיינים שמות מתחם" /></div>
</form><br />
<div class="quote">
<br /><br /><div style="text-align:right;padding-right:20%">
<?
$query = mysql_query("SELECT * FROM `recomment` WHERE `page`='$id'");
$i = 0;
$con = mysql_num_rows($query);
$con = $con - 1;
$recomment = array(mysql_num_rows($query));
while($rr = mysql_fetch_array($query)){
$id = $rr['id'];
$recomment[$i] = $id;
$i++;
}
$x = rand(0,$con);
$query2 = mysql_query("SELECT * FROM `recomment` WHERE `id`='$recomment[$x]'");
$rr2 = mysql_fetch_array($query2);
$recomment = $rr2['recomment'];
echo $recomment;
?>

</div>
</div>
<div class="space">
&nbsp;
</div>
<div class="good">
&nbsp;
</div>
<div class="space">
&nbsp;
</div>
<div class="aq">
&nbsp;
</div>
<div class="space">
&nbsp;
</div>
<div class="underline">
<img src="thumb1.jpg" alt="" />
</div>

<!-- End ads -->
</div>
<!-- End of domain box -->

</div>
</div>
<!-- The next -->
</div>
</body>
</html>

CSS:


.space{
width:760px;
height:3px;
}
.spacex{
width:760px;
height:6px;
}
.linewithtwo{
width:760px;
}
.domainbox{
float:left;
width:227px;
height:165px;
background-color:#BCD9E9;
}
.domaintext{
padding-top:2%;
color:white;
}
.domainsearchtext{
font-family:Tahoma;
font-size:14px;;
background-color:#467795;
color:white;
}
.domainspace{
width:760px;
height:3px;
}
.domainspacer{
width:760px;
height:6px;
}
.domainads{
width:210px;
height:85px;
background-color:white;
}

.toptitle{
float:right;
direction:rtl;
background-image:url(blue.jpg);
background-repeat:no-repeat;
width:512px;
height:30px;
font-weight:bold;
font-family:Tahoma;
font-size:22px;
color:#283D5F;
text-align:right;
}
.toptitlesec{
float:right;
direction:rtl;
background-image:url(blue2.jpg);
background-repeat:no-repeat;
width:auto;
height:30px;
font-weight:bold;
font-family:Tahoma;
font-size:22px;
color:#283D5F;
text-align:right;
}
html>body .textarea {
width:520px;
}

.textarea{
float:right;
direction:rtl;
height:auto;
font-family:arial;
font-size:14px;
color:#000;
text-align:right;
}
.quote{
padding-right:100%
direction:rtl;
width:226px;
height:163px;
font-family:arial;
font-size:14px;
background-image:url(quote.jpg);
}
.good{
padding-right:100%
direction:rtl;
width:226px;
height:163px;
background-image:url(good.jpg);
}
.aq{
padding-right:100%
direction:rtl;
width:226px;
height:163px;
font-family:arial;
font-size:14px;
background-image:url(aq.jpg);
}
.underline{
vertical-align:buttom;
float:left;
}

Screen shot from FF:
http://img337.imageshack.us/img337/2919/ffrv7.jpg
Screen shot from IE7:
http://img406.imageshack.us/img406/4711/ie7ds9.jpg
Screen shot from IE6:
http://img337.imageshack.us/img337/6629/ie6dp0.jpg
mwatkins
07-09-2007, 11:05 AM
Maybe before you look for problems you should:

a) ensure that you've got css declarations properly terminated by a semi-colon. Quick inspection shows a number missing...

b) ensure you've spelled every statement correctly

.quote{
padding-right:100%
.good{
padding-right:100%
.aq{
padding-right:100%
.underline{
vertical-align:buttom;

c) run it through the CSS validator and correct any errors and then retest. It doesn't make sense putting effort into debugging CSS which doesn't validate first. If the CSS isn't on a server, get the Firefox developer tool bar extension which makes it easy to submit a "local" CSS or XHTML file to validators.

http://jigsaw.w3.org/css-validator/

Same deal with validating your xhtml, as this can affect the output too:

http://validator.w3.org/

If the problem persists, then come on back...
Butbul
07-10-2007, 03:21 AM
Sorry, i posted this old CSS, my new one have tested for valid with w3c css validator.

My XHTML is absolutely VALID, just have some problem with the valid with my meta tags,

Waiting for help.