All,
I'm a designer trying to learn to also be somewhat of a developer. It's going to become painfully clear in a second, that I have no idea what I am doing. That said, I am trying to build a very simple website with a friend and am having trouble getting it display properly. My DIV seems to be ignoring what I am trying to tell it in my style sheet. I can't get it to display a background image in a DIV, and using an IMG tag in the DIV just won't allow me to format it the way I would like too.
Here is a link to the website in question. www.playvking.com/beta/
Below if my code, it's pretty short. Is my syntax messed in my style sheet, or am I trying to nest DIVs in a way that's ain't possible? I appreciate any help you could give me, I thought this would be pretty simple, but now. not so sure.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>VKING. HANDCRAFTED IN VERMONT. INSPIRED BY A CLASSIC SWEDISH LAWN GAME.</title>
<link href="http://www.playvking.com/default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="bodycontain">
<div id="nav">
<img src="images/vking_nav_logo.jpg" /><a href="index.html"><img src="images/vking_nav_home.jpg" border="0" /></a><a href="about.html"><img src="images/vking_nav_aboutus.jpg" border="0" /></a><a href="shop.html"><img src="images/vking_nav_shop.jpg" border="0"/></a><a href="rules.html"><img src="images/vking_nav_rules.jpg" border="0" /></a><a href="whoplays.html"><img src="images/vking_nav_whoplays.jpg" border="0" /></a><a href="video.html"><img src="images/vking_nav_video.jpg" border="0" /></a><a href="photo.html"><img src="images/vking_nav_photo.jpg" border="0" /></a>
</div>
<div id="photocontain">
<img src="images/vking_body_photo1.jpg">
</div>
<div id="copyarea">
<p>Copy</p>
</div>
<div id="footer">
<span class="footertext">©2008 Wilde Games, LLC South Burlington, VT 05403 | 888.348.0339 | sales@playvking.com</span>
</div>
</body>
</html>
CSS
body {
margin-top: 75px;
padding: 0;
color: #666666;
}
.headertype
{
font-family: Helvetica, Verdana, Arial, sans-serif;
font-size: 2em;
font-weight: bolder;
text-transform: uppercase;
color: #CCCCCC;
}
.footertext
{
font-family: Georgia, Times New Roman, Verdana;
font-size: 2em;
text-align: center;
font-weight: normal;
color: #291D12;
}
/* BODY */
#bodycontain {
width: 899px;
height: 800px;
margin: 0 auto;
position: relative;
}
#photocontain {
width: 800px;
height: 305px;
}
#nav {
height: 112px;
background: #FFFFFF;
}
#copyarea {
padding-left: 20px;
width: 385px;
height: 358px;
}
#footer {
width: 899px;
height: 25px;
background-image: url(images/vking_footer.jpg);
}
Well, your server says http://www.playvking.com/beta/images/bodybg.gif doesn't exist. I wouldn't trust that though, because it also says that http://www.playvking.com/beta/images/ doesn't exist. It does, because http://www.playvking.com/beta/images/vking_body_photo1.jpg is there.
Can you check where you have that background image? Maybe there is a mistake with spelling or case.
Can you check where you have that background image? Maybe there is a mistake with spelling or case.
QUOTE(pandy @ Aug 26 2008, 03:08 PM) 
Well, your server says http://www.playvking.com/beta/images/bodybg.gif doesn't exist. I wouldn't trust that though, because it also says that http://www.playvking.com/beta/images/ doesn't exist. It does, because http://www.playvking.com/beta/images/vking_body_photo1.jpg is there.
Can you check where you have that background image? Maybe there is a mistake with spelling or case.
My BG image is http://www.playvking.com/beta/images/vkingbg.jpg, which also wouldn't show up but is no longer being called in my code.
I should have explained that everything within the beta folder is from me, everything else was preexisting. I was trying to help redesign a website that had been put up a few months ago. Do you think that the code could be correct but some server side funkiness is going on between the two websites. I could migrate to a new development site?
Well, if it isn't in your code it isn't likely to show up. 
Where are the images that ARE in your code but still don't show up? bodybg.gif and viking.gif.
Where are the images that ARE in your code but still don't show up? bodybg.gif and viking.gif.
QUOTE(pandy @ Aug 26 2008, 03:20 PM)
Well, if it isn't in your code it isn't likely to show up.
Where are the images that ARE in your code but still don't show up? bodybg.gif and viking.gif.
The image that is being called from the FOOTER of the style sheet. Anytime I try to get an image to appear this way it doesn't work. I took out the others and just started to focus on the footer to avoid confusing myself. Originally I was trying to get background images in the footer, the bodycontain and the copyarea DIVs through this method but with no luck.
Does that make sense?
QUOTE(pandy @ Aug 26 2008, 03:20 PM)
Well, if it isn't in your code it isn't likely to show up.
Where are the images that ARE in your code but still don't show up? bodybg.gif and viking.gif.
The image that is being called from the FOOTER of the style sheet. Anytime I try to get an image to appear this way it doesn't work. I took out the others and just started to focus on the footer to avoid confusing myself. Originally I was trying to get background images in the footer, the bodycontain and the copyarea DIVs through this method but with no luck.
Does that make sense?
Are you aware that http://www.playvking.com/beta/ is using http://www.playvking.com/default.css which is different from http://www.playvking.com/beta/default.css ?
And you should probably clean up the markup errors reported by our online validator.
And you should probably clean up the markup errors reported by our online validator.
Not really since the rule for #footer isn't in the style sheet you have online.
Anyway, http://www.playvking.com/beta/images/vking_footer.jpg does exist and if I add that rule for #footer to your CSS the background displays.
Anyway, http://www.playvking.com/beta/images/vking_footer.jpg does exist and if I add that rule for #footer to your CSS the background displays.
OK. Darin was quicker as usual. And smarter! 
QUOTE(pandy @ Aug 26 2008, 03:38 PM)
OK. Darin was quicker as usual. And smarter!
Thanks, I was not aware of that. It's always the details that get me, damn think coding trickery. Thinking I might just stick to designing.
Thanks to both you guys! Sorry for the double post.
I didn't see it either. I downloaded your style sheet without looking at the URL really. 
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.