Ryan Szablewski
12-14-2006, 04:34 PM
Good Morning All,
Another question:
I'm just trying to "skills" here at work on Divs... Once again, Firefox and IE don't match. I copied most of my Div code from Lissa, because I am not good enough to make my own yet, I'm just learning off of her tutorial and editing it, except I changed positions/colors.
I am trying to make the middle section (#center) in IE match what I have in FF. I'm assuming, from what other posters have said, that my code is invalid, however I don't know how/why.
Any suggestions?
My code is:
<html>
<head>
<title>Three Column CSS Layout with Header</title>
<center>
<style type="text/css">
body
{ margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
}
#header {
margin: 20px;
padding: 0px;
height: 100px;
background-color:#000000;
font-color:#FFFFFF;
}
#left {
position: absolute;
left: 20px;
top: 121px;
width: 200px;
height: 100%;
background-color:#000000;
}
#center {
position: absolute;
top: 121;
margin-left: 221px;
margin-right: 221px;
background-color:#FFFFFF;
overflow: auto;
}
#right {
position: absolute;
right: 20px;
top: 121px;
width: 200px;
height: 100%;
background-color:#000000;
}
</style>
</head>
<body bgcolor="808080">
<div id="header">
Your header will go here. You can place images, text links, etc. in this div. To change
the properties of this div you can change the #header selector in the style sheet that is
located on this page between the head tags.
</div>
<div id="left">
Your left menu will go here. You can place images, text links, etc. in this div. To change
the properties of this div you can change the #left selector in the style sheet that is
located on this page between the head tags.
</div>
<div id="center">
All of your content goes in this div. This section is fluid so that if the window is
collapsed, your div will collapse also and fit the screen perfectly. To change the
properties of this div you can change the #center selector in the style sheet that is
located on this page between the head
tags.<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
</div>
<div id="right">
Your right menu will go here. You can place images, text links, etc. in this div. To
change the properties of this div you can change the #right selector in the style sheet that
is located on this page between the head tags.
</div>
</body>
</html>
Another question:
I'm just trying to "skills" here at work on Divs... Once again, Firefox and IE don't match. I copied most of my Div code from Lissa, because I am not good enough to make my own yet, I'm just learning off of her tutorial and editing it, except I changed positions/colors.
I am trying to make the middle section (#center) in IE match what I have in FF. I'm assuming, from what other posters have said, that my code is invalid, however I don't know how/why.
Any suggestions?
My code is:
<html>
<head>
<title>Three Column CSS Layout with Header</title>
<center>
<style type="text/css">
body
{ margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
}
#header {
margin: 20px;
padding: 0px;
height: 100px;
background-color:#000000;
font-color:#FFFFFF;
}
#left {
position: absolute;
left: 20px;
top: 121px;
width: 200px;
height: 100%;
background-color:#000000;
}
#center {
position: absolute;
top: 121;
margin-left: 221px;
margin-right: 221px;
background-color:#FFFFFF;
overflow: auto;
}
#right {
position: absolute;
right: 20px;
top: 121px;
width: 200px;
height: 100%;
background-color:#000000;
}
</style>
</head>
<body bgcolor="808080">
<div id="header">
Your header will go here. You can place images, text links, etc. in this div. To change
the properties of this div you can change the #header selector in the style sheet that is
located on this page between the head tags.
</div>
<div id="left">
Your left menu will go here. You can place images, text links, etc. in this div. To change
the properties of this div you can change the #left selector in the style sheet that is
located on this page between the head tags.
</div>
<div id="center">
All of your content goes in this div. This section is fluid so that if the window is
collapsed, your div will collapse also and fit the screen perfectly. To change the
properties of this div you can change the #center selector in the style sheet that is
located on this page between the head
tags.<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
</div>
<div id="right">
Your right menu will go here. You can place images, text links, etc. in this div. To
change the properties of this div you can change the #right selector in the style sheet that
is located on this page between the head tags.
</div>
</body>
</html>