|
Jordan -> DIVs overlapping when they're not supposed to! (3/1/2007 18:07:14)
|
This is my first attempt at laying out a site completely with an external style sheet. My efforts look great in IE7, but when I view it in Firefox or Opera my DIVs (stacked horizontally) overlap where they should not or I have gaps. Does anyone have some experience with this? Any advice? I'm driving myself nuts with this!
~Jordan
This is the link of the test site.
Here's the pertinent CSS code.
BODY {
background-color : #484f7f;
margin-top : 0;
margin-left : 0;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#header {
position: absolute;
left : 0px;
top : 0px;
}
#flash{
position: absolute;
left : 0px;
top : 158px;
}
#header-menu {
font-size: 11px;
color: White;
position : absolute;
left : 700px;
top : 10px;
font-weight : bold;
}
#menu-home {
position : absolute;
left : 200px;
top : 317px;
}
#blue-spacer {
position : absolute;
left : 0px;
top : 100px;
}
#home-text {
margin-left: 200px;
margin-top: 365px;
font-size: 12px;
color: white;
}
Here's the pertinent page code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Bett Solutions :: People, Performance, Purpose</title>
<link rel="stylesheet" type="text/css" href="style-main.css">
<script type="text/javascript" language="JavaScript1.2" src="_pgtres/stmenu.js"></script>
</head>
<img ID="header" src="images/Header.gif" width="800" height="159">
<div id="header-menu">
<p><a class="menu" href="http://www.bettsolutions.com/index.htm">HOME</a><br>
<a class="menu" href="http://www.bettsolutions.com/contact.htm">CONTACT</a></p></div>
<div id=home-blue-spacer><div id=flash><object classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" id="obj1" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" border="0" width="800" height="159">
<param name="movie" value="intro.swf">
<param name="quality" value="High">
<embed src="intro.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj1" width="800" height="159"></object></div></div>
<div ID=menu-home><!--webbot bot="Include" U-Include="menu.htm" TAG="BODY" --></div>
<div id="home-text">
<p><b>BettSolutions works with your organization
to Build People and Organizational Capabilities through the
establishment and implementation of Human Capital Strategies.<br>
<br>
</b>We provide consulting services on the <b>Lominger
International’s LEADERSHIP ARCHITECT®</b>
Suite of tools as well as work with organizations to design and
implement customized leadership development, competency-based
and human capital initiatives.<br>
<br>
Our mission is to help organizations maximize the potential
of their <b>PEOPLE</b>, their <b>PERFORMANCE</b> and the overall
<b>PURPOSE</b> of the organization.
</p>
</div>
</body>
</html>
|
|
|
|
