strippy
21st October 07, 04:51 AM
at some point ie7 turned funky.
firefox loads fine, but but in ie7 my main content div drops below my float left.
Not sure why, but this happened after I created the navbar.
html
-----------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>E-Com Solutions</title>
<link rel="stylesheet" type="text/css" href="ecom.css" />
</head>
<body>
<div id="header">
<h1>Leading the way
<br />
to better solutions</h1>
</div>
<hr id="pain" />
<ul class="nav">
<li><a href="ecom.html" class="navbar">Home</a></li>
<li><a href="aboutus.html" class="navbar">About Us</a></li>
<li><a href="equipment.html" class="navbar">Equipment</a></li>
<li><a href="services.html" class="navbar">Services</a></li>
<li><a href="technology.html" class="navbar">Technology</a></li>
</ul>
<hr class="clear" />
<div id="industry">
<div id="ccinfo" class="sideleft">
<h3>Credit Cards</h3>
<p>
<span class="sidegroup1">Knowledge Base</span>
</p>
<p>
<a href="sidebar/creditcards/thebasics.html">The Basics</a>
<br />
<a href="sidebar/creditcards/interchange.html">Interchange Tables</a>
<br />
<a href="sidebar/creditcards/fees.html">Understanding Fees</a>
</p>
<p>
<span class="sidegroup1">Rules & Regs</span>
</p>
<p>
<a href="sidebar/creditcards/compliance.html">Compliance</a>
<br />
<a href="sidebar/creditcards/security.html">Security Standards</a>
</p>
</div>
<div id="checkinfo" class="sideleft">
<h3>The Check World</h3>
<p>
<a href="sidebar/checkworld/problempaper.html">Problematic Paper</a>
<br />
<a href="sidebar/checkworld/acceptance.html">Proper Check Acceptance</a>
<br />
<a href="sidebar/checkworld/check21.html">Check 21</a>
</p>
</div>
<div id="newinfo" class="sideleft">
<h3>New & Exciting</h3>
<p>
<a href="sidebar/new/terminal.html">Virtual Terminal</a>
<br />
<a href="sidebar/new/cash.html">Cash Advance</a>
<br />
<a href="sidebar/new/package.html">Ultimate Package</a>
</p>
</div>
</div>
<div id="main">
<p>
Main Content kjghllllllllllllllllllllllllll<br />
gfhkjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj jj<br />
hgkfffffffffffffffffffffffffffffffffffffffffffffff ff<br />
ghckkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk<br />
</p>
</div>
</body>
</html>
css:
-------------------------------------------------------------------------
body {
font: small/1.6em Verdana, Helvetica, Arial, sans-serif;
background-image: url(steel_background_2.gif);
width: 800px;
margin: auto;
}
#header {
margin: 5px 1px 1px 1px;
padding: 40px 10px 40px 350px;
background-color: rgb(28, 148, 157);
background-image: url(logos/E-ComSolutions_logo.gif);
background-repeat: no-repeat;
background-position: 10px center;
}
#stray {
margin: 0px 10px 0px 10px;
font-size: 1.25em;
}
ul.nav {
list-style-type: none;
padding-left: 0;
margin: 1px 0px 0px 1px;
width: 100%;
}
ul.nav a {
display: block;
width: 11.50em;
text-align: center;
border: 4px solid black;
text-decoration: none;
color: black;
line-height: 250%;
background-color: silver;
padding: 0px;
font: bold 100%/250% Arial, Helvetica, sans-serif;
border-right-color: #666;
border-bottom-color: #333;
border-top-color: #DFDFDF;
border-left-color: #858585;
}
a.navbar:hover {
background: url(steel_background_2.gif);
}
ul.nav li {
float: left;
}
#pain {
padding: 0;
margin: 0;
}
.clear {
clear: both;
}
#main {
width: 800px;
height: 1200px;
margin: -4px 0px 0px 0px;
padding: 10px 0px;
background-color: rgb(28, 148, 157);
}
#industry {
width: 205px;
float: left;
margin: 0px 10px 10px 0px;
padding: 10px;
}
.sideleft {
border: solid medium;
padding: 10px;
margin: 0px;
background-color: rgb(197, 197, 197);
}
.sidegroup1 {
font-size: 100%;
font-weight: bold;
margin: 0px;
padding: 0px;
}
firefox loads fine, but but in ie7 my main content div drops below my float left.
Not sure why, but this happened after I created the navbar.
html
-----------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>E-Com Solutions</title>
<link rel="stylesheet" type="text/css" href="ecom.css" />
</head>
<body>
<div id="header">
<h1>Leading the way
<br />
to better solutions</h1>
</div>
<hr id="pain" />
<ul class="nav">
<li><a href="ecom.html" class="navbar">Home</a></li>
<li><a href="aboutus.html" class="navbar">About Us</a></li>
<li><a href="equipment.html" class="navbar">Equipment</a></li>
<li><a href="services.html" class="navbar">Services</a></li>
<li><a href="technology.html" class="navbar">Technology</a></li>
</ul>
<hr class="clear" />
<div id="industry">
<div id="ccinfo" class="sideleft">
<h3>Credit Cards</h3>
<p>
<span class="sidegroup1">Knowledge Base</span>
</p>
<p>
<a href="sidebar/creditcards/thebasics.html">The Basics</a>
<br />
<a href="sidebar/creditcards/interchange.html">Interchange Tables</a>
<br />
<a href="sidebar/creditcards/fees.html">Understanding Fees</a>
</p>
<p>
<span class="sidegroup1">Rules & Regs</span>
</p>
<p>
<a href="sidebar/creditcards/compliance.html">Compliance</a>
<br />
<a href="sidebar/creditcards/security.html">Security Standards</a>
</p>
</div>
<div id="checkinfo" class="sideleft">
<h3>The Check World</h3>
<p>
<a href="sidebar/checkworld/problempaper.html">Problematic Paper</a>
<br />
<a href="sidebar/checkworld/acceptance.html">Proper Check Acceptance</a>
<br />
<a href="sidebar/checkworld/check21.html">Check 21</a>
</p>
</div>
<div id="newinfo" class="sideleft">
<h3>New & Exciting</h3>
<p>
<a href="sidebar/new/terminal.html">Virtual Terminal</a>
<br />
<a href="sidebar/new/cash.html">Cash Advance</a>
<br />
<a href="sidebar/new/package.html">Ultimate Package</a>
</p>
</div>
</div>
<div id="main">
<p>
Main Content kjghllllllllllllllllllllllllll<br />
gfhkjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj jj<br />
hgkfffffffffffffffffffffffffffffffffffffffffffffff ff<br />
ghckkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk<br />
</p>
</div>
</body>
</html>
css:
-------------------------------------------------------------------------
body {
font: small/1.6em Verdana, Helvetica, Arial, sans-serif;
background-image: url(steel_background_2.gif);
width: 800px;
margin: auto;
}
#header {
margin: 5px 1px 1px 1px;
padding: 40px 10px 40px 350px;
background-color: rgb(28, 148, 157);
background-image: url(logos/E-ComSolutions_logo.gif);
background-repeat: no-repeat;
background-position: 10px center;
}
#stray {
margin: 0px 10px 0px 10px;
font-size: 1.25em;
}
ul.nav {
list-style-type: none;
padding-left: 0;
margin: 1px 0px 0px 1px;
width: 100%;
}
ul.nav a {
display: block;
width: 11.50em;
text-align: center;
border: 4px solid black;
text-decoration: none;
color: black;
line-height: 250%;
background-color: silver;
padding: 0px;
font: bold 100%/250% Arial, Helvetica, sans-serif;
border-right-color: #666;
border-bottom-color: #333;
border-top-color: #DFDFDF;
border-left-color: #858585;
}
a.navbar:hover {
background: url(steel_background_2.gif);
}
ul.nav li {
float: left;
}
#pain {
padding: 0;
margin: 0;
}
.clear {
clear: both;
}
#main {
width: 800px;
height: 1200px;
margin: -4px 0px 0px 0px;
padding: 10px 0px;
background-color: rgb(28, 148, 157);
}
#industry {
width: 205px;
float: left;
margin: 0px 10px 10px 0px;
padding: 10px;
}
.sideleft {
border: solid medium;
padding: 10px;
margin: 0px;
background-color: rgb(197, 197, 197);
}
.sidegroup1 {
font-size: 100%;
font-weight: bold;
margin: 0px;
padding: 0px;
}