...

View Full Version : Help: CSS IE and Firefox



silverskymedia
12-08-2005, 04:45 AM
How do I construct this page to look right in both IE and Firefox?

http://www.rapiddeploymentinc.com/default.html

It looks good in Firefox, but then in IE it's just slightly off. Thanks for the help.

_Aerospace_Eng_
12-08-2005, 04:58 AM
You do not need to position EVERYTHING absolute.

<!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">
<head>
<title>Web Layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
margin: 0;
padding: 0;
background: #b8bdc3 url(images/body_bg.gif) repeat-x top;
font: 12px 'lucida grande', geneva, arial, verdana, sans-serif;
color: #000;
}
#container {
width:780px;
margin:auto;
}
#top {
height:75px;
background-color: #FFFFCC;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#mainmenu {
height:40px;
background-color: #FF9933;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#header {
height:150px;
background-color: #00FFFF;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#content {
width:653px;
height:350px;
float:left;
background-color: #FFFFFF;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#footer {
height:45px;
clear:both;
background-color: #FF9900;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#leftnav {
float:left;
width:125px;
height:350px;
background-color: #FF9900;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}

p {
margin:0;
padding:0 5px;
text-align:justify;
}
-->
</style>
</head>
<body>
<div id="container">
<div id="top"></div>
<div id="mainmenu"></div>
<div id="header"></div>
<div id="leftnav"></div>
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum interdum, ante a mattis laoreet, erat lorem tempor ipsum, faucibus pretium magna odio et pede. Fusce a libero interdum libero faucibus commodo. Pellentesque posuere lectus ut pede. Aenean sed dui. Cras rutrum facilisis sem. Nulla consectetuer. Nam pulvinar, quam vitae lobortis commodo, sem sapien auctor metus, consequat iaculis libero nulla in neque. Nulla facilisi. Ut facilisis aliquam nunc. Duis posuere lectus. Donec eu mauris. Mauris ultrices, velit a rutrum auctor, tortor sem scelerisque nunc, a commodo pede sapien eget nulla. Integer tincidunt est sit amet arcu.</p>
<p>Curabitur augue justo, aliquet non, facilisis vitae, ullamcorper dapibus, elit. Phasellus sodales sapien vitae lacus. Quisque nisl. Donec nonummy. Morbi placerat pede ut risus. In fringilla arcu ut sapien. Mauris sed sem. Mauris ornare, diam non dignissim ultrices, libero ligula facilisis tortor, id volutpat leo magna nec urna. Nulla tempus. Sed mattis molestie nisi. Maecenas pede arcu, porta eu, aliquam rhoncus, varius quis, libero. Suspendisse potenti. Maecenas rutrum arcu nec orci. Maecenas egestas. Fusce ornare, odio pulvinar blandit varius, nisl justo venenatis dolor, varius viverra dolor velit et dui.</p>
<p>Suspendisse dapibus felis et nibh. Nullam nec elit sed massa gravida interdum. Nam orci quam, facilisis in, pulvinar vitae, convallis at, neque. Maecenas molestie auctor augue. Nullam vehicula ante. Sed vel elit. Quisque tempor leo ac diam. Aenean venenatis nisi sit amet nisi. Vivamus sodales. Donec auctor. Aenean aliquet. Nam libero. In pellentesque, elit sit amet consequat varius, nisl diam facilisis elit, ullamcorper volutpat odio lectus sit amet lectus. Vivamus dapibus purus non ante. Nunc hendrerit. Donec imperdiet. Aliquam dui elit, condimentum ac, lacinia in, cursus nec, purus. Vivamus cursus risus. Ut lacinia felis sagittis magna.</p>
</div>
<div id="footer"></div>
</div>
</body>
</html>

silverskymedia
12-08-2005, 05:04 AM
Good tip. Thanks, worked great.

drhowarddrfine
12-08-2005, 02:07 PM
both IE and FirefoxMake sure you use a proper doctype. Using one keeps IE from going into 'quirks' mode and keeps all browsers on the same set of rules. Otherwise, you may find modern browsers working correctly but differently than old, buggy IE.

silverskymedia
12-08-2005, 08:07 PM
Make sure you use a proper doctype. Using one keeps IE from going into 'quirks' mode and keeps all browsers on the same set of rules. Otherwise, you may find modern browsers working correctly but differently than old, buggy IE.


OK, what's the proper doctype? I thought I was using the proper one.

_Aerospace_Eng_
12-08-2005, 08:15 PM
What I used is fine, you have the choice between the first 2 and the 4th and 5th one on this page http://www.w3schools.com/tags/tag_doctype.asp You can use the frameset ones but only if your page consists of a frameset.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum