Afbeelding wordt niet gezien
Zien jullie ergens een fout?
Bestandlocatie indeling:
index.html
favicon.jpg
style.css
images (map) > totale.png
index.html:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" type="text/css" rel="stylesheet">
<link rel="shortcut icon" type="image/jpg" href="favicon.jpg">
<title>Naam tabblad</title>
</head>
<body>
<div class="container">
<div class="totale">
</div>
</div>
</body>
</html>
style.css:
* {margin:0px;padding:0px;border:0px;}
html, body {width:100%;height:100%; background-image: url(".");
background-repeat: no-repeat; background-color: white; background-position: center;}
.clear {clear:both;}
table {border-collapse:collapse;}
table td {vertical-align:top;}
A {text-decoration:none}
.body
{
font-family: Calibri;
font-size:12px;
margin: auto;
background-position: center;
}
.container
{
/*background-image: url("../images/repeater.png");
background-repeat: repeat-y;
height: 100%;*/
width: 1079px;
margin: 0px auto;
}
.totale
{
background-image:url(../images/totale.png);
background-repeat:no-repeat;
float: left;
width: 1079px;
height: 857px;
}
Gewijzigd op 24/08/2012 20:08:37 door Ruben Fonteijne
Dat de afbeeldingen niet worden weergegeven ligt sowieso aan de url. Echter is de vraag waar de pagina staat.
Staat deze op een webserver dan zou ik de dubbele punt voor de slash weglaten.
Roep je de pagina gewoon vanaf je eigen schijf, dan ook de slash weglaten.
ik ben hem eerst nog aan het testen op de localhost. Heb background-image: url(../images/totale.png}; verandert in background-image: url(images/totale.png); maar ook dit maakt geen verschil.
{
background-image:url('/images/totale.png');
background-repeat:no-repeat;
float: left;
width: 1079px;
height: 857px;
}
Geeft nog steeds geen afbeeldingen..
Daarna zou het moeten werken.
Je kan dit makkelijker controleren door ipv een image een kleur voor de background te gebruiken. Zie je direct wat je doet.
Als je dan een block ziet, kun je hem vullen met de image.
{
background-image:url('images/totale.png');
background-repeat:no-repeat;
position:relative;
float: left;
width: 1079px;
height: 857px;
}
Heb de afbeelding ook verandert naar background-color: black;
maar ook dan komt er geen zwart scherm. Het ligt dus niet aan de afbeelding.
Ook dit werkt niet.. Snap er niks meer van.
Toevoeging op 24/08/2012 21:07:31:
Het is gelukt! Geen idee wat ik precies heb gedaan. De '' hadden ook geholpen.
Muchos gracias, amigos!
Gewijzigd op 24/08/2012 20:50:44 door Ruben Fonteijne
Kijk hier: http://jsfiddle.net/Navelpluisje/mUFVa/
moet gewoon werken, kan volgens mij alleen het pad naar de afbeelding zijn.
Had je edit niet gezien;-)
Gewijzigd op 24/08/2012 21:24:22 door Erwin Goossen