for reason, of background-image elements not being shown when run code. being over-ridden, , shown being crossed out in inspect element > stlyes output.
how can rid of over-ride, without using !important tag? need images show up! missing blindly obvious.
body { background-image: "images/bg.png"; } #headnav { top: 0; background-image: "images/header.png"; height: 70px; display: block; } #dash { background-image: "images/dash.png"; height: 800px; width: 600px; display: block; } #testcanvas { margin: auto; position: absolute; left: 0; right: 0; } #snowflakesliders { position: relative; margin: 0 auto; top: 450px; margin-left: 300px; } input { margin: 10px; } #attribute { margin-right: 10px; }<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>canvas test using double buffering</title> <link type="text/css" rel="stylesheet" href="slider4.css"> </head> <body onload="init()"> <div id="headnav"></div> <div id="dash"> <canvas id="testcanvas" width="400" height="400"> canvas not supported </canvas> <div id="snowflakesliders"> <p id="attribute">speed</p> <span id="sliderstatus" class="sliderspan">50</span> <input type="range" min="0" max="100" value="50" step="2" onchange="sliderchange(this.value)" /> <br /> <br /> <p id="attribute">width</p> <span id="sliderwidth" class="sliderspan">5</span> <input type="range" min="0" max="10" value="5" step="1" onchange="sliderchangewidth(this.value)" /> <br /> <br /> <p id="attribute">height</p> <span id="sliderheight" class="sliderspan">100</span> <input type="range" min="0" max="200" value="100" step="1" onchange="sliderchangeheight(this.value)" /> <br /> <br /> </div> </div> </body> <script src="slider4.js"></script> </html>
try making background-image value url("image_path_here.png")
example: background-image: url("images/bg.png");
hope helps!
