- Apr 13, 2012
- 6
- 0
- 10,510
I'm making a simple website and I got a background image for the content part of the site but it won't print out to my screen when I view the site.
I have 1 big div-element that holds 2 smaller div-elements inside itself (2 columns). The divs that are inside the bigger one will just use the default background-color (dark blue) and not show the white image.
My CSS:
and my index.html:
I have 1 big div-element that holds 2 smaller div-elements inside itself (2 columns). The divs that are inside the bigger one will just use the default background-color (dark blue) and not show the white image.
My CSS:
Code:
body{
margin: 0;
padding: 0;
background-color: #0e5181;
}
#wrapper {
width: 1000px;
margin: 0 auto;
}
#logo {
background-image: url('../kuvat/logo.gif');
height: 130px;
width: 1000px;
}
#content {
background-image: url('../kuvat/keski.gif');
background-color: #fff;
margin: 0 auto;
}
#valikko {
width: 150px;
float: left;
}
#sisalto {
width: 850px;
float: right;
}
#footer {
background-image: url('../kuvat/footer.gif');
width: 1000px;
height: 43px;
clear: both;
}
#footer p {
text-align: center;
}and my index.html:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi" lang="fi">
<head>
<title>Cool Card</title>
<link rel="stylesheet" type="text/css" href="css/tyyli.css" />
</head>
<body>
<div id="wrapper">
<div id="logo">
</div>
<div id="content">
<div id="valikko">
<a href="#">LINK</a>
</div>
<div id="sisalto">
*MAIN CONTENT HERE*
</div>
</div>
<div id="footer">
<p>Copyright © 1999-2012 Cool Card</p>
</div>
</div>
</body>
</html>
Facebook
Twitter