...

View Full Version : background



snowysweb
11-05-2008, 07:49 AM
hello all. i made a site the other day and it worked just as i wanted it to. put all the contents of my directory folder onto a disk to take it home with me. loaded it up when i got home and previewed it and yet again, the background images wouldnt work on firefox, same on every page and same on other sites iv'e made. does anyone know if there is a browser setting of something that is stopping the background images being loaded on my pc???

abduraooft
11-05-2008, 07:51 AM
A link to your page can talk more about the issue than the text above. Can we have a link?

snowysweb
11-05-2008, 07:55 AM
2 mins just uplaoding now

kryssy23
11-05-2008, 07:57 AM
it normally mean the image link is broken. If your planning to use the your computer (have all the files on the comp hard drive) instead of the cd...I would suggest to re link all the images and make sure the images are in the same folder as all the files.

This happens to me a lot until i got a portable hard drive, now I work straight from that with no problems

snowysweb
11-05-2008, 07:58 AM
sorry gonna have to shoot of to work lol, give it 15 mins while it uploads then go here

http://www.thelizardofozexotics.co.uk/Snowyswebsolutions/new/portfolio.html

thank you

snowysweb
11-05-2008, 07:59 AM
no man, iv re link all images by hand theres no prob cause they show up in IE
and prob your computer but not mine!$%$"

kryssy23
11-05-2008, 08:02 AM
sorry gonna have to shoot of to work lol, give it 15 mins while it uploads then go here

http://www.thelizardofozexotics.co.uk/Snowyswebsolutions/new/portfolio.html

thank you

is the problem the black squares? if it is I have had a look at your source code and you don't have the images code anywhere except for the banner, which can be seen

abduraooft
11-05-2008, 08:18 AM
Have a look at
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.thelizardofozexotics.co.uk%2FSnowyswebsolutions%2Fnew%2Fportfolio.html&charset=%28detect+automatically%29&doctype=Inline&group=0
and http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.thelizardofozexotics.co.uk%2FSnowyswebsolutions%2Fnew%2Fportfolio.htm l&profile=css21&usermedium=all&warning=1&lang=en

Fix them all first.

snowysweb
11-05-2008, 05:08 PM
the backround image is in the style sheet

snowysweb
11-05-2008, 05:20 PM
css:

.port_box {
width: 200px;
height: 200px;
float: left;
padding: 2px;
margin: 5px;
overflow: hidden;
background-color: #000;
}
#main {
text-align: center;
width:100%;
}

.float_wrapp {
width: 860px;
margin: 10px auto;
padding: 10px;
background-color: #e3d17b;
position: relative;
}
#silverburn {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/silverburn.JPG);
}
#silverburn:hover {
background-image: url(images/for web/silverburn.jpg);
}
#compo {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/componants.jpg);
}
#compo:hover {
background-image: url(images/for web/componants2.jpg);
}
#taran {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/tarantula.jpg);
}
#taran:hover {
background-image: url(images/for web/tarantula2.jpg);
}
#plant {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/plantplanner.jpg);
overflow: auto;
}
#plant:hover {
background-image: url(images/for web/plantplanner2.jpg);
}
#gecko {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/geckogang.jpg);
}
#gecko:hover {
background-image: url(images/for web/geckogang2.jpg);
}
#dark {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/darklight.jpg);
}
#dark:hover {
background-image: url(images/for web/darklight2.jpg);
}


#lizard {
width: 200px;
height: 200px;
display: block;
background-image: url(images/for web/darken/thelizardofoz.jpg);
}

#sub_main {
width: 997px;
height: 170px;
border: 2px solid #217870;
margin: 10px auto;
padding: 0;
background-color: #e8b609;
z-index: 0;
}
#lizard:hover {
background-image: url(images/for web/thelizardofoz2.jpg);
}

.float_wrapp .port_box #silverburn span {
display: none;
}
.float_wrapp .port_box #compo span {
display: none;
}
.float_wrapp .port_box #lizard span {
display: none;
}
.float_wrapp .port_box #gecko span {
display: none;
}
.float_wrapp .port_box #taran span {
display: none;
}
.float_wrapp .port_box #plant span {
display: none;
}
.float_wrapp .port_box #dark span {
display: none;
z-index: 0;
}
.float_wrapp .port_box #silverburn:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}


.float_wrapp .port_box #compo:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}

.float_wrapp .port_box #taran:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}
.float_wrapp .port_box #plant:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}
.float_wrapp .port_box #gecko:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}
.float_wrapp .port_box #lizard:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;

}
.float_wrapp .port_box #dark:hover span {
position:absolute;
width:989px;
display:block;
background: #e8b609;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #217870;
padding:4px;
left:-60px;
top:-184px;
height: 162px;
border: 2px solid #217870;
background-color: #e8b609;
}

#h1_cen {
width: 100%;
text-align: left;
}

h1 {
margin:5px 0 0 30px;
padding:0;
font-family: Georgia, "Times New Roman", Times, serif;
color: #217870;
}
#h2_cen {
width: 100%;
text-align: left;
}
h2 {
margin:5px 0 0 30px;
padding:0;
font-family: Georgia, "Times New Roman", Times, serif;
color: #217870;
font-size: 22px;
}
.url {
margin:0;
padding:0;
position:absolute;
top: 125px;
left: 50px;
}

page now validates but still nothing..

abduraooft
11-05-2008, 05:26 PM
url(images/for web/darken/silverburn.JPG); Have a try by renaming your directory and removing the space. Then change paths in the CSS also.

destruction
11-06-2008, 06:21 AM
images/for web/darklight2.jpg
why you not used same directory for image?

and changes like this

./darklight2.jpg

snowysweb
11-06-2008, 07:42 AM
ok, ive sortted the background images out and it validates (i will sort out how it diplays the writting later). does anyone know (before i just use this for firefox and someother way for IE) how to do the hover thing for IE aswell???

jerry62704
11-06-2008, 10:41 PM
IE sees hover only on anchors. Worse case, create a dummy anchor back to itself.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum