Weird Weird problem with HTML and CSS

Butters · 29 Oct 2007 at 22:58

Hi guys, I'm sure I'm loosing my mind.

If you just create a simple document like this:-

Code:

<html>
<head>
</head>

<body>
Test
</body>
</html>

and upload it, what colour would you expect the background to be?

More so, if you uploaded this:-

Code:

<html>
<head><style type="text/css">
<!--
BODY {
     background-image: url(images/bg.jpg);
     background-repeat: no-repeat;
}
-->
</style>
</head>

<body>
Test
</body>
</html>

and you created a folder called 'images' and uploaded the bg.jpg file, you'd expect to see the image on the background right?

Ok, so explain this to me

www.azurejewels.co.uk

Butters · 29 Oct 2007 at 23:03

Hmm, changed it to a gif and it seems to have sorted itself but why is the background a greyish colour?

The only colours in the images are the reds. It should appear, in theory, on a white background.

Butters · 29 Oct 2007 at 23:21

Smithy said:
Are you sure the grey background isn't the transparency of the GIF not showing correctly?

(I should probably say; I can't view your website)

Well, I wondered that, but even with no images and no link to images, just pure HTML shows a tinge of grey in the background (compared to the white of google for example)

Butters · 29 Oct 2007 at 23:40

IE7.

I'm getting roughly were I want to be now

HTML is here

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">
<head>
<link rel="stylesheet" type="text/css" href="screen.css" media="screen" />
</head>

<body>
<div id="wrapper"><!--start wrapper-->
<div id="content">
<div id="main-content">
<h1>Welcome to Azure Jewels</h1>
<p>This site is currently under development. Please check back here for updates</p>
</div><!--end main-content-->
</div>
</div><!--end wrapper-->
</body>
</html>

and CSS is here (so far)

Code:

/* CSS Document */

body{		
background-image: url(images/bg.gif);	
background-repeat:repeat;*/	
padding:0px;	
margin:0px;	
}

#wrapper{	
width:700px;	
background-color:#FFF;	
font-family:Verdana, Arial, Helvetica, sans-serif;	
font-size:11px;	
filter:alpha(opacity=65);
opacity: 0.65;
-moz-opacity:0.65;
margin-top:20px;	
margin-left:auto;	
margin-right:auto;	
padding:12px;	
border: solid 2px #E5E5E5;	
}

#content{	
float:left;
}

#main-content{	
float:left;	
width:690px;	
margin-top:5px;	
padding:5px;	
/*border-right: solid 1px #d9d9d9;*/	
}	

#main-content p{	
padding-right:0px;	
}			

#main-content h1{	
color: #000;	
font-size:20px;	
font-family:Calibri, Arial, Helvetica, sans-serif;	
font-weight:bolder;	
margin-bottom:0px;	
width:310px;	
border-bottom:1px solid #ABABAB;	
padding-left:2px;	
}

Site is as per post one

Can't you see the source through that?

Butters · 30 Oct 2007 at 00:21

Thats what I'm saying, even without all the CSS junk and any images, I wrote code like this

Code:

<html>
<head></head>
<body>
test
</body>
</html>

and it appeared on a grey background. There was no image folder, no CSS nothing.