I use CSS to position my page instead of tables. I got one problem: I use one global DIV to position all the others in the center, and I would like tu use this DIV for a backgroundimage.
It works fine in IE but not in Netscape. This DIV has no contents except for other div's and netscape seems to set the height to 0.
How can I get it so the height in NS of the div is the height of my page, so the backgroundimage shows?
Thanks
AhasCan we see the full page?The new version isn't online yet.
The old version: <!-- w --><a class="postlink" href="http://www.cvpberingen.be">www.cvpberingen.be</a><!-- w -->
This one still uses a table for main layout.
The code for the new version that works with IE is:
<html>
<head>
<title>CD&V-Beringen</title>
<style>
body {
background-color:#bf5009;
margin:0px 0px 0px 0px;
text-align:center;
}
a {
text-decoration:none;
font-size:12pt;
font-weight:bold;
color: #BF5009;
}
a:hover {
text-decoration:none;
font-size:12pt;
font-weight:bold;
color: #F8B445;
}
#container{
width:700;
background-image:url(bglights.jpg);
background-position:100% 100%;
background-repeat:no-repeat;
margin-right:auto;
margin-left:auto;
}
#banner {
font-weight:bold;
font-family:times new roman, serif;
background-image:url(cdvtop.jpg);
height:78px;
border-bottom: 2px solid #BF5009;
voice-family: "\"}\"";
voice-family: inherit;
height:78px;
color:#0a078d;
text-align:left;
}
html>body #banner {
height:78px;
}
#nav {
width:100%;
font-family: Arial, sans-serif;
font-size:10pt;
background-color: #BF5009;
margin-left: 0;
border-bottom: 2px solid #BF5009;
}
#nav ul {
display:inline;
margin-left:0;
padding-left:0;
}
#nav li {
display:inline;
list-style:none;
}
#nav a.navi {
padding: 3px 3px 3px 3px;
border-left: 10px solid #BF5009;
border-right: 10px solid #BF5009;
background-color: #E16F30;
color: #fff;
font-size:10pt;
font-weight:bold;
text-decoration: none;
width:96px;
text-align:center;
font-family:times new roman, serif;
}
#nav a.navi:hover {
padding: 3px 3px 3px 3px;
border-left: 10px solid #F8B445;
border-right: 10px solid #F8B445;
background-color: #EFAF7F;
color: #BF5009;
font-weight:bold;
text-decoration: none;
width:96px;
text-align:center;
font-size:10pt;
font-family:times new roman, serif;
}
#main {
float:left;
width:55%;
margin-right:15px;
padding-bottom:20px;
margin-left:20px;
margin-top:40px;
font-size:12pt;
text-align:left;
}
#rightcontent {
float:right;
width:200px;
margin-right:15px;
margin-left:20px;
margin-top:40px;
padding-bottom:20px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
border-top:10px solid #BF5009;
border-right:2px solid #BF5009;
border-left:2px solid #BF5009;
border-bottom:2px solid #BF5009;
text-align:left;
}
</style>
</head>
<body>
<div id="container">
<div id="banner"><br><br><br> <script language="javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"slogan.js"></script></div>
<div id="nav">
<ul>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mandaten.htm" class="navi">Mandaten</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"actueel.htm" class="navi">Actueel</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"chatcafe.htm" class="navi">Chatcaf?lt;/a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mening.htm" class="navi">Uw mening</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"links.htm" class="navi">Links</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mailto:[email protected]?subject=e-mail via website cdenv" class="navi">Contact</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"index.htm" class="navi">Home</a></li>
</ul>
</div>
<div id="main">
<p><h2>Uit de actualiteit:</h2></p>
<p><a href=http://www.webdeveloper.com/forum/archive/index.php/"ford.htm">Ford-drama bewijst nood aan industrieel beleid.</a><br>CD&V-voorzitter Yves Leterme trok donderdag met de Limburgse parlementsleden en dé—ÂÂ渦té—ÂÂ
It works fine in IE but not in Netscape. This DIV has no contents except for other div's and netscape seems to set the height to 0.
How can I get it so the height in NS of the div is the height of my page, so the backgroundimage shows?
Thanks
AhasCan we see the full page?The new version isn't online yet.
The old version: <!-- w --><a class="postlink" href="http://www.cvpberingen.be">www.cvpberingen.be</a><!-- w -->
This one still uses a table for main layout.
The code for the new version that works with IE is:
<html>
<head>
<title>CD&V-Beringen</title>
<style>
body {
background-color:#bf5009;
margin:0px 0px 0px 0px;
text-align:center;
}
a {
text-decoration:none;
font-size:12pt;
font-weight:bold;
color: #BF5009;
}
a:hover {
text-decoration:none;
font-size:12pt;
font-weight:bold;
color: #F8B445;
}
#container{
width:700;
background-image:url(bglights.jpg);
background-position:100% 100%;
background-repeat:no-repeat;
margin-right:auto;
margin-left:auto;
}
#banner {
font-weight:bold;
font-family:times new roman, serif;
background-image:url(cdvtop.jpg);
height:78px;
border-bottom: 2px solid #BF5009;
voice-family: "\"}\"";
voice-family: inherit;
height:78px;
color:#0a078d;
text-align:left;
}
html>body #banner {
height:78px;
}
#nav {
width:100%;
font-family: Arial, sans-serif;
font-size:10pt;
background-color: #BF5009;
margin-left: 0;
border-bottom: 2px solid #BF5009;
}
#nav ul {
display:inline;
margin-left:0;
padding-left:0;
}
#nav li {
display:inline;
list-style:none;
}
#nav a.navi {
padding: 3px 3px 3px 3px;
border-left: 10px solid #BF5009;
border-right: 10px solid #BF5009;
background-color: #E16F30;
color: #fff;
font-size:10pt;
font-weight:bold;
text-decoration: none;
width:96px;
text-align:center;
font-family:times new roman, serif;
}
#nav a.navi:hover {
padding: 3px 3px 3px 3px;
border-left: 10px solid #F8B445;
border-right: 10px solid #F8B445;
background-color: #EFAF7F;
color: #BF5009;
font-weight:bold;
text-decoration: none;
width:96px;
text-align:center;
font-size:10pt;
font-family:times new roman, serif;
}
#main {
float:left;
width:55%;
margin-right:15px;
padding-bottom:20px;
margin-left:20px;
margin-top:40px;
font-size:12pt;
text-align:left;
}
#rightcontent {
float:right;
width:200px;
margin-right:15px;
margin-left:20px;
margin-top:40px;
padding-bottom:20px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
border-top:10px solid #BF5009;
border-right:2px solid #BF5009;
border-left:2px solid #BF5009;
border-bottom:2px solid #BF5009;
text-align:left;
}
</style>
</head>
<body>
<div id="container">
<div id="banner"><br><br><br> <script language="javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"slogan.js"></script></div>
<div id="nav">
<ul>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mandaten.htm" class="navi">Mandaten</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"actueel.htm" class="navi">Actueel</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"chatcafe.htm" class="navi">Chatcaf?lt;/a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mening.htm" class="navi">Uw mening</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"links.htm" class="navi">Links</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"mailto:[email protected]?subject=e-mail via website cdenv" class="navi">Contact</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"index.htm" class="navi">Home</a></li>
</ul>
</div>
<div id="main">
<p><h2>Uit de actualiteit:</h2></p>
<p><a href=http://www.webdeveloper.com/forum/archive/index.php/"ford.htm">Ford-drama bewijst nood aan industrieel beleid.</a><br>CD&V-voorzitter Yves Leterme trok donderdag met de Limburgse parlementsleden en dé—ÂÂ渦té—ÂÂ