CSS Support for cross browser hacks

renet Greenhorn

Messages:: 54

Likes Received:: 0

Best Answers:: 0

Trophy Points:: 16

#1

This code below if for a webpage that appears fine on the newest firefox browser but not on IE browsers. What code is missing or should be corrected to make this display correctly on IE browsers. I think it is fine on Safari. Any help very appreciated.

-------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.example.net/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" xmlns="http://www.example.net/1999/xhtml"><head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>

<meta name="description" content="real estate listings">
<meta name="keywords" content="homes for sale">
<style type="text/css">

#container {
width: 900px;
margin-left: 40px;
height: 900px;
margin-top: 5px;
margin-bottom: 25px;
font-family: "Times New Roman", Times, Serif;
font-size: 1.1em;
border: 1px solid #ccc;
font-weight: 300;
padding: 1px;

}

#col1 {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #ccc;
float: left;
width: 279px;
height: 900px;
margin: 0px;
padding: 25px 10px 5px 13px;
margin: 1px;
}

#col2 {
border: 1px solid #000;
background-color: #ffcc99;
width: 255px;
height: 900px;
float: left;
padding: 25px 25px 5px 13px;
margin: 1px;
}

#col3 {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #ccc;
border-right: 1px solid #000;
background-color: #fff;
font: #fff;
width: 279px;
height: 900px;
float: right;
padding: 25px 5px 5px 8px;
margin: 1px;
}
#span {
font-size: 1.50em;
padding-bottom: 15px;
text-align: center;
font-weight: 700;
}
#span2 {
font-size: 1.25em;
padding-bottom: 25px;
text-align: center;
}
#span3 {
font-size: .85em;
font-weight: normal;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
}
#span4 {
font-size: 1.25em;
font-weight: bold;
text-align: center;
padding-top: 25px;
color: #ff3300;
}
#span5 {
font-size: .85em;
font-weight: lighter;
color: blue;
text-align: center;
line-spacing: 1.5em;
padding-left: 15px;

}
#span6 {
font-size: .75em;
font-weight: bold;
text-align: left;
font-color: #000;
padding-left: 25px;
}
#span7 {font-size: .85em;
font-weight: normal;
padding-top: 5px;
padding-bottom: 5px;
text-align: left;
}

#box1 {
text-align: center;
}

.clear {
clear: both;
}
</style></head>
<div id="container">
<div id="col1">
<div id="span">Setting the Stage<br>
For Your Home Purchase<br>
But in Reverse!</div>
<div id="span7"> Example, example, example, example, example, example, example. Example, example, example, example, example, example, example.<p><center><img src="http://example.net/pics/lessonpics/house2.png"></center></a><br>
Example, example, example, example, example, example, example.Example, example, example, example,
example, example, example. Example, example, example, example, example, example, example.<p>
Example, example, example, example, example, example, example.
Example, example, example, example, example, example, example.</div><p> <div id="span3">(Con't col 2)</div></div>

<div id="col2"><div id="span">Bank Owned<br> Inventory List</div>
<div id="span3">Example, example, example, example, example, example, example.</div><p>
<div id="span5">
<a href="http://example.net">El Dorado Hills Listings</a><br>
<a href="http://example.net">El Dorado Hills Listings</a><p>
<a href="http://example.net">El Dorado Hills Inventory Under $500K</a><br>
<a href="http://example.net">El Dorado Hills Inventory Under $500K</a><p>
<a href="http://example.net">Homes Over $500K - El Dorado Hills</a><br>
<a href="http://example.net">Homes Over $500K - El Dorado Hills</a><p>
<a href="http://example.net">Folsom Bank Owned Listings</a><br>
<a href="http://example.net">Folsom Bank Owned Listings</a><p>
<a href="http://example.net">Folsom Homes Over $400K</a><br>
<a href="http://example.net">Folsom Homes Over $400K</a><p>
<a href="http://example.net">Folsom Homes Under $400K</a><br>
<a href="http://example.net">Folsom Homes Under $400K</a><p>

</div>
<div id="span3">If you see anything that you would like to view or for any other questions please call or e-mail<p>
Google AD</div>
<div id="box1">
</div></div>
<div id="col3"><div id="span3">(Con't from col 1)</div><p><div id="span7">
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example<p>
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example<p>
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
Example, example, example, example, example, example, example
<p>
Provided by:<br>
Name<br>
Company<br>
Address <br>
Address <br>
Phone<br>
email<br>
http://www.example.net</div>

</div>
</div></div>
</body></html>