css background images/layout problems in opera

[katch22]

Would anyone have a look at the code below for me? The pages using the code display fine in IE6, the code is valid css, but in Opera the layout is all to cock and the background images do not display.

Any suggestions greatly appreciated!

**css code**

body {
font-size: 12px;
font-family: Arial, Verdana, sans-serif;
margin: 0px;
padding: 0px;
text-align: center;
background-position: center;
background-image: url(images\bg.gif);
background-repeat: repeat-y; }

#container {
width: 752px;
margin: 0px auto;
text-align : left;
clear : both;
}

#header {
width: 752px;
height: 128px;
background-image: url(images\header.gif);
background-repeat: no-repeat;
background-position: center;
border-top: 1px solid black;
border-bottom: 3px solid black;
clear: both; }

#leftpane {
width: 200px;
float: left;
padding: 10px 5px 35px 5px;
}

#leftpane h5 {
height: 126px;
background: yellow url(images\portrait.jpg) no-repeat; }

#leftpane h5 span {
display: none; }

#nav {
width: 188px;
background-color: #FFFF8C;
line-height: 3em;
border-top: 2px solid gray;
border-left: 2px solid gray;
border-right: 1px solid silver;
border-bottom: 1px solid silver;
padding: 5px;
float: left; }

.subnav {
padding: 0 0 10px 2px;
background-color: #FFFFCF;
border-top: 2px solid gray;
border-left: 2px solid gray;
display: block;
font-weight: normal; }

#bodytext {
width: 552px;
padding: 4px;
text-align: left;
float: right ; }

#bodyheader {
background-color: #FFF8DC;
width: 530px;
height: 140px;
margin: 6px;
padding: 6px;
clear: both;
border: solid 1px black;
}

#bodybottom {
width: 530px;
margin-left: 6px;
background-color: #fff;
text-align: left;
}

#bodybottom hr {
width: 80%;
text-align: center; }

#newssection {
background-color: #CCE2FF;
width: 530px;
margin: 6px;
padding: 4px;
border: 1px solid black;
clear: both; }

#newsleft {
width: 250px;
padding: 2px;
float: left;
clear: none;
}

#newsleft h5 {
background: #fff url(images\pagecurl.gif) bottom right no-repeat;
border: 2px solid red;
padding: 2px; }

#newsleft h5 span {
font-weight: normal;
}

#newsright {
width: 250px;
padding: 2px;
float: right;
clear: none;
}

#newsright h5 {
background: #fff url(images\pagecurl.gif) bottom right no-repeat;
border: 2px solid red;
padding: 2px; }

#newsright h5 span {
font-weight: normal; }

#meetttheteam {
background: url(images\theteam.gif) no-repeat;
height: 125px; }

#meetttheteam h3 span { display: none; }

img.intro {
margin-right: 5px;
float: left;
border: 1px solid blue;
}

p.quote {
font-weight: bold;
text-align: center; }

p.just {
font-weight: bold;
text-align: justify; }

p.justquote {
font-weight: bold;
text-align: justify;
padding: 5px;

border: 1px solid gray;
background-color: #FFF8DC; }

p.copyright {
font-size: 8px; }

p.maptext {
font-size: 9px; }

table {
font-size: 12px;
padding: 2px 10px 2px 2px; }

#nav A {
font-weight: bold;
text-decoration: none;
color: black; }

#nav A:hover {
text-decoration: underline; }

.subnav A {
font-size: 90%;
padding-left: 12px;
line-height: 1.5em;
text-decoration: none;
font-weight: bold; }

.subnav A:link {
}

.subnav A:active {
}

.subnav A:visited {
}

.subnav A:hover {
text-decoration: underline; }

[encyclo]

url(images\bg.gif);

You surely mean

url(images[b]/[/b]bg.gif);

You've got backslashes rather than forward slashes in the paths to the files. IE will probably forgive this kind of error, but Opera is unlikely to.

As for the other layout problems, what is the specific problem you are encountering?

[katch22]

Thanks for the quick response. I think I tried this before. Anyhow I changed the code, but it made no difference - there are still no bg images. Regarding the layout, I'm not as concerned about that for the time being, I'd rather get the bg imgs sorted.

[katch22]

I stuck the css file in the images dir, removed the paths and it works now. Not quite sure why, but thanks for drawing my attention to it!