belledumonde
05-29-2006, 01:17 PM
i have a fixed width for the body of my page. it works fine in FireFox. all the elements appear as they should, correct padding of the text etc. but when i open it in IE, i have to refresh the page at least 3 times before it looks right.
how can i fix this in the CSS code or is there a way i can force the page to refresh itself in IE?
CSS
/*Layout Properties*/
body, html {
background-color: #F6CF7C;
margin:0;
padding:0;
}
body {
min-width:750px;
}
#wrap {
background-color: #F6CF7C;
margin:0 auto;
width:750px;
}
div.banner, div.upperlinks, div.lower, div.navi {
clear: both;
}
div.banner {
background-color: #F6CF7C;
}
div.content, div.floorplans {
background-color: white;
}
div.lower {
background-color: #FBE7BD;
margin-bottom: 0;
}
div.banner {
margin-top: 3px;
}
div.navi {
background-color: #AB770C;
margin-top: 0;
padding: 0;
}
div.content {
margin-left: 133px;
margin-bottom: 0;
min-height:100px;
padding-top: 1%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 0.5%;
}
div.floorplans {
margin-left: 133px;
min-height:100px;
padding-top: 1%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 0.5%;
}
/*Menu*/
#nav {
margin:0;
padding:0;
list-style:none;
width:131px;
float:left;
}
#nav li a {
font-size: 10pt;
color:#AB770C;
background-color:#FBE7BD;
display:block;
width:128px;
padding:6px 0 6px 3px;
font-weight:bold;
}
#nav li a:hover {
color:#FBE7BD;
background-color:#CC9966;
text-decoration:none;
}
/*Links Properties*/
a {
font-family: Verdana, Arial, sans-serif;
color: #AB770C;
font-weight: bold;
text-decoration: none;
}
p.text a, p.rightlinks a {
background-color: white;
}
p.nav a, p.nav a:hover {
background-color: #AB770C;
}
p.upperlinks a, p.upperlinks a:hover {
background-color: #F6CF7C;
}
p.upperlinks a, p.text a, p.rightlinks a{
font-size: 10pt;
}
p.upperlinks a:hover, p.text a:hover, p.rightlinks a:hover,
p.imageandcaption a:hover{
text-decoration: underline;
}
p.text a:hover, p.rightlinks a:hover {
background-color: white;
}
p.upperlinks, p.rightlinks {
text-align: right;
}
p.upperlinks {
margin: 0;
padding: 0;
}
p.nav a {
color: #FBE7BD;
font-size: 8pt;
}
p.nav a:hover {
text-decoration: underline;
}
p.nav {
color: #FBE7BD;
text-align: center;
line-height:150%;
background-color: #AB770C;
margin: 0;
padding: 0;
}
/*Text Attributes*/
p.title, p.imageandcaption {
background-color: white;
text-align: center;
}
p.text, p.imageandcaption {
background-color: white;
font-family: Verdana, Arial, sans-serif;
font-size: 10pt;
color: #4B4B4B;
}
p.text {
text-align: justify;
line-height: 150%;
}
p.imageandcaption {
font-style: italic;
line-height: 150%;
}
h1 {
font-family: Verdana, Arial, sans-serif;
text-decoration: underline;
background-color: white;
color: #4B4B4B;
font-size: 12pt;
text-align: left;
line-height: 150%;
}
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="en">
<link rel="stylesheet" type="text/css" href="style.css">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="keywords" content="home house pampanga sale townhouse philippines san fernando">
<meta name="description" content="Realize your dreams of a quiet country home in the Philippines only minutes away from all the benefits of a highly urbanized lifestyle">
<meta name="robots" content="index,follow">
<title>Townhouses for sale in Pampanga, Philippines! - Tagle Homes</title>
</head>
<body >
<div id="wrap">
<div class="banner">
<img id="sunkissed" src="sunkissed.gif" alt="Tagle Homes in Pampanga, Philippines">
</div>
<div class="upperlinks"><p class="upperlinks">
<a href="Site_map.htm">Site Map</a> |
<a href="Contact_us.htm">Contact Us</a></p>
</div>
<div class="lower">
<ul id="nav">
<li><a href="index.htm">Home</a></li>
<li><a href="The Townhouses.htm">The Townhouses</a></li>
<li><a href="GalleryMain.htm">Gallery</a></li>
<li><a href="The_Area.htm">The Area</a></li>
<li><a href="Terms.htm">Terms</a></li>
<li><a href="http://validator.w3.org/check?uri=referer">
<img src="valid-html401.gif" border="0" alt="Valid HTML 4.01 Page"></a></li>
</ul>
<div class="content">
<p class="title">
<img src="welcome.GIF" alt="Welcome!"><br>
</p>
<p class="text" style="text-align: center">
<i>This is the official website of Tagle Homes, built to provide
information on the beautifully finished townhouses we have for
sale located in the City of San Fernando, Pampanga,
Philippines.</i><br>
</p>
<p class="text">
The dream of a better home and a better life becomes a reality with
Tagle Homes' Townhouses Pampanga! Meticulously planned and built,
these townhouse units are designed to realize your dreams of a quiet
country home, yet only minutes away from all the benefits of a
highly urbanized lifestyle.
</p>
<p class="text">
Tucked away in the friendly streets of Pilar Village, the townhouses
are situated at the heart of Pampanga in the <b>City of San Fernando</b>,
with quick and easy access to quality educational institutions,
shopping centers, hospitals, churches, business establishments,
recreational facilities and much more.
</p>
<p class="text">
Explore the links on the left, and if you are convinced after viewing this website, that this is the
house for you, and that Pampanga is somewhere you can call home,
click on the <a href="Contact_us.htm">Contact Us</a> link to find out how you can reach us by
phone, e-mail or even text.</p>
<p class="imageandcaption">
**Find out what's new by checking out the <a href="update.htm">updates</a>!!**</p>
</div>
</div>
<div class="navi">
<p class="nav">| <a href="index.htm">Home</a> |
<a href="The Townhouses.htm">The Townhouses</a> |
<a href="The_Area.htm">The Area</a> |
<a href="GalleryMain.htm">Gallery</a> |
<a href="Terms.htm">Terms</a> | <a href="Site_map.htm">Site Map</a> |
<a href="Contact_us.htm">Contact Us</a> |
</p>
</div>
</div>
</body>
</html>
how can i fix this in the CSS code or is there a way i can force the page to refresh itself in IE?
CSS
/*Layout Properties*/
body, html {
background-color: #F6CF7C;
margin:0;
padding:0;
}
body {
min-width:750px;
}
#wrap {
background-color: #F6CF7C;
margin:0 auto;
width:750px;
}
div.banner, div.upperlinks, div.lower, div.navi {
clear: both;
}
div.banner {
background-color: #F6CF7C;
}
div.content, div.floorplans {
background-color: white;
}
div.lower {
background-color: #FBE7BD;
margin-bottom: 0;
}
div.banner {
margin-top: 3px;
}
div.navi {
background-color: #AB770C;
margin-top: 0;
padding: 0;
}
div.content {
margin-left: 133px;
margin-bottom: 0;
min-height:100px;
padding-top: 1%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 0.5%;
}
div.floorplans {
margin-left: 133px;
min-height:100px;
padding-top: 1%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 0.5%;
}
/*Menu*/
#nav {
margin:0;
padding:0;
list-style:none;
width:131px;
float:left;
}
#nav li a {
font-size: 10pt;
color:#AB770C;
background-color:#FBE7BD;
display:block;
width:128px;
padding:6px 0 6px 3px;
font-weight:bold;
}
#nav li a:hover {
color:#FBE7BD;
background-color:#CC9966;
text-decoration:none;
}
/*Links Properties*/
a {
font-family: Verdana, Arial, sans-serif;
color: #AB770C;
font-weight: bold;
text-decoration: none;
}
p.text a, p.rightlinks a {
background-color: white;
}
p.nav a, p.nav a:hover {
background-color: #AB770C;
}
p.upperlinks a, p.upperlinks a:hover {
background-color: #F6CF7C;
}
p.upperlinks a, p.text a, p.rightlinks a{
font-size: 10pt;
}
p.upperlinks a:hover, p.text a:hover, p.rightlinks a:hover,
p.imageandcaption a:hover{
text-decoration: underline;
}
p.text a:hover, p.rightlinks a:hover {
background-color: white;
}
p.upperlinks, p.rightlinks {
text-align: right;
}
p.upperlinks {
margin: 0;
padding: 0;
}
p.nav a {
color: #FBE7BD;
font-size: 8pt;
}
p.nav a:hover {
text-decoration: underline;
}
p.nav {
color: #FBE7BD;
text-align: center;
line-height:150%;
background-color: #AB770C;
margin: 0;
padding: 0;
}
/*Text Attributes*/
p.title, p.imageandcaption {
background-color: white;
text-align: center;
}
p.text, p.imageandcaption {
background-color: white;
font-family: Verdana, Arial, sans-serif;
font-size: 10pt;
color: #4B4B4B;
}
p.text {
text-align: justify;
line-height: 150%;
}
p.imageandcaption {
font-style: italic;
line-height: 150%;
}
h1 {
font-family: Verdana, Arial, sans-serif;
text-decoration: underline;
background-color: white;
color: #4B4B4B;
font-size: 12pt;
text-align: left;
line-height: 150%;
}
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="en">
<link rel="stylesheet" type="text/css" href="style.css">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="keywords" content="home house pampanga sale townhouse philippines san fernando">
<meta name="description" content="Realize your dreams of a quiet country home in the Philippines only minutes away from all the benefits of a highly urbanized lifestyle">
<meta name="robots" content="index,follow">
<title>Townhouses for sale in Pampanga, Philippines! - Tagle Homes</title>
</head>
<body >
<div id="wrap">
<div class="banner">
<img id="sunkissed" src="sunkissed.gif" alt="Tagle Homes in Pampanga, Philippines">
</div>
<div class="upperlinks"><p class="upperlinks">
<a href="Site_map.htm">Site Map</a> |
<a href="Contact_us.htm">Contact Us</a></p>
</div>
<div class="lower">
<ul id="nav">
<li><a href="index.htm">Home</a></li>
<li><a href="The Townhouses.htm">The Townhouses</a></li>
<li><a href="GalleryMain.htm">Gallery</a></li>
<li><a href="The_Area.htm">The Area</a></li>
<li><a href="Terms.htm">Terms</a></li>
<li><a href="http://validator.w3.org/check?uri=referer">
<img src="valid-html401.gif" border="0" alt="Valid HTML 4.01 Page"></a></li>
</ul>
<div class="content">
<p class="title">
<img src="welcome.GIF" alt="Welcome!"><br>
</p>
<p class="text" style="text-align: center">
<i>This is the official website of Tagle Homes, built to provide
information on the beautifully finished townhouses we have for
sale located in the City of San Fernando, Pampanga,
Philippines.</i><br>
</p>
<p class="text">
The dream of a better home and a better life becomes a reality with
Tagle Homes' Townhouses Pampanga! Meticulously planned and built,
these townhouse units are designed to realize your dreams of a quiet
country home, yet only minutes away from all the benefits of a
highly urbanized lifestyle.
</p>
<p class="text">
Tucked away in the friendly streets of Pilar Village, the townhouses
are situated at the heart of Pampanga in the <b>City of San Fernando</b>,
with quick and easy access to quality educational institutions,
shopping centers, hospitals, churches, business establishments,
recreational facilities and much more.
</p>
<p class="text">
Explore the links on the left, and if you are convinced after viewing this website, that this is the
house for you, and that Pampanga is somewhere you can call home,
click on the <a href="Contact_us.htm">Contact Us</a> link to find out how you can reach us by
phone, e-mail or even text.</p>
<p class="imageandcaption">
**Find out what's new by checking out the <a href="update.htm">updates</a>!!**</p>
</div>
</div>
<div class="navi">
<p class="nav">| <a href="index.htm">Home</a> |
<a href="The Townhouses.htm">The Townhouses</a> |
<a href="The_Area.htm">The Area</a> |
<a href="GalleryMain.htm">Gallery</a> |
<a href="Terms.htm">Terms</a> | <a href="Site_map.htm">Site Map</a> |
<a href="Contact_us.htm">Contact Us</a> |
</p>
</div>
</div>
</body>
</html>