...

View Full Version : I am having trouble with background images in mozilla.



MikeDentino
11-06-2011, 04:38 PM
I am relatively new to css and am designing a website for my friend. I am mainly developing the site for google chrome and it works fine in chrome. But in mozilla the background image does not appear. Also in IE and mozilla the browser outlines my hyperlinked images, which does not help the positioning. If anyone can take a look over my code and fix this problem, or any other problems you might find for that matter, that would be highly appreciated.

Also I am designing the site in a folder on my high schools ptsa website which i made. Any and all input is appreciated!

http://brickmemorialptsa.org/DERP/derper/index.php

[CODE]
body
{

margin:0px 0 0 0px;
padding:0px 0 0 0px;
background:url(backgroundsmall.jpg);
background-repeat: repeat;
display: block;
}

#content
{
font-size:16px;
font-family:arial;
font-color: #ffffff;
margin:24px 0px 0px 20px;
padding:0px 0px 0px 0px;
float:left;
width:685px;
height:100%;
clear:both;
display: block;
}

#main
{
margin:0px auto;
padding:0px 0 0px 0px;
width:1001px;
height:100%;
background:url(http://brickmemorialptsa.org/DERP/derper/CompleteWebsitev22.jpg);
display:block;
}

.navbar
{
margin:302px 0 0 10px;
padding:0px 0 0px 0px;
float:left;
height:42px;
width:995px;
display: block;
}

.page
{
margin:0px -4px 0 2px;
padding:0px 0 0px 0px;

}

.links
{
margin:40px 0 0 0px;
width:170px;
height:100px;
list-style:none;
}

.links li
{
background:url(images/bullet.jpg) no-repeat;
background-position:left;
background position:left;
padding:3px 0 5px 20px;
background-position:left;
}

.links li a
{
font-size:13px;
font-family:arial;
font-weight:bold;
color:white;
}

.links li a:hover
{
font-size:16px;
font-family:arial;
font-weight:bold;
color:white;
}

.hyper
{
font-size:16px;
font-family:arial;
color:#ffffff;
}

.hyper a:hover
{
color:#ffffff;
}

#footer
{
margin:0 auto;
padding:0px 0 0 0px;
width:1000px;
height:61px;
clear:both;
background:url(http://brickmemorialptsa.org/DERP/Footer.png) no-repeat;
}
[CODE]

Excavator
11-06-2011, 05:03 PM
Hello MikeDentino,
I see the background images in FF8 and IE9.
The ouline is IE's default border. Remove that with this line added to your CSS - img {border: none;}

MikeDentino
11-06-2011, 05:12 PM
O yea, well i have fire fox 3.6, so that must be the problem. Is there any reason why it wouldn't show up in that

Excavator
11-06-2011, 06:12 PM
Invalid code - http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fbrickmemorialptsa.org%2FDERP%2Fderper%2Findex.php

See the links about validation in my signature line.

// is not a valid way to comment your CSS. See CSS comments here (http://webdesign.about.com/cs/css/ht/htcommentcss.htm).

MikeDentino
11-06-2011, 06:28 PM
wow thanks, yea im not used to coding websites. I'm primarily into java and c++. But I'm definitely gonna use that validation thing from now on

Excavator
11-06-2011, 06:35 PM
I'm primarily into java and c++.

I figured that when I saw the //
:D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum