Background image not showing up

HTML & CSS
1

Can anyone help me out on this? I need to know why my background image is not showing up in my #maintop .update area of my homepage (at the top right … it has a scrolling announcement in there…and there is supposed to be a background image).

http://www.billboardfamily.com

2

It seems that there are smart people on this thread so hopefully you can help me. I’m in the process of converting my web pages to css. I’m working with 2 different groups: My first group includes a folder with my html and my style.css, and another folder for my images. My second group includes my html in one folder; my images in another folder; and my style.css in the main second group folder. The latter group is the one that isn’t working. All the files are identical but in my second group my background and figurine isn’t showing up. any help would be greatly appreciated!

3

There was a lot of conflicting css, but I got it straightened out. I am now trying to make the background image extend down farther…without affecting anything else. Thanks

4

I see you have it sorted :slight_smile: What was the problem?

5

Now the background image appears, but the div has moved from where it is supposed to be located (where it originally was).

HTML

<?php include("header.php"); ?>


<div id="maintop">
	<div class="border">
	
	
	<img src="http://billboardfamily.com/wp-content/themes/mensa/assets/images/largedots.png" alt="Welcome To The Billboard Family Online!" />

	</div>

<div class="columns">
	<div class="welcome">
	<img src="http://billboardfamily.com/wp-content/themes/mensa/assets/images/welcome.png" alt="Welcome To The Billboard Family Online!" />

	<p>We are <span style="color: #00afef;"><strong>The Billboard Family</strong></span> -- a REAL family of 4 (with one on the way) who wears YOUR COMPANY SHIRTS all day long, taking loads of photos and videos. We then promote your company online on Facebook, Twitter, Flickr, YouTube, and our Website, as well as to all of the many people who ask us why we are all wearing the same shirts :). We live in the St. Louis, Missouri area, but we travel and take vacations frequently. Some of the places we travel to include Chicago, IL, Seattle, WA, Walt Disney World&#0153; Orlando, FL, and the Southern Illinois University (SIU) area in Illinois. We have plans to travel much more in the near future.</p>


	</div>

<div class="welcomeimage">
<img src="http://billboardfamily.com/wp-content/themes/mensa/assets/images/main_photo.png" alt="Welcome To The Billboard Family Online!" />
</div>

<div class="update">
<?php if (function_exists (gAnnouncement)) gAnnouncement(); ?> 
</div>

</div>

<div class="border">
	
	<img src="http://billboardfamily.com/wp-content/themes/mensa/assets/images/largedots.png" alt="Welcome To The Billboard Family Online!" />

	</div>

</div>

<div style="clear">&nbsp;</div>

<?php include ('sidebar_index.php'); ?>

<!-- BEGIN content -->
<div id="content" style="margin-top: 10px;">
	
	<div class="post"><?php
 $lastposts = get_posts('numberposts=1&category=6');
 foreach($lastposts as $post) :
    setup_postdata($post);
 ?>
 <h2><a href="<?php the_permalink(); ?>" id="post-<?php the_ID(); ?>"><?php the_title(); ?></a></h2>
 <?php the_content(); ?>
 <?php endforeach; ?>
	</div>
	
</div>
<!-- END content -->

<?php get_footer(); ?>

CSS for that section

/** BEGIN index top **/
#maintop {
	float: left;
	height: 200px;
	width: 1000px;
	font-family: Arial;
		
}
	#maintop .border {
		background: transparent url(../images/largedots.png) repeat-x bottom;
		clear: both;
	}
	#maintop .welcome {
		width: 495px;
		padding: 10px 0 5px 3px;
		font-size: 15px;
		float: left;
		padding-top: 5px;	
		padding-bottom: 10px;
	}
	#maintop .welcome p {
		padding-top: 10px;
	}
	#maintop .welcome img {
		padding-top: 5px;
	}
	#maintop .welcomeimage {
		float: left;
		width: 250px;
		display: inline;
		padding-left: 5px;
	}
	#maintop .update {
		background: transparent url(../images/update_bg.png) no-repeat bottom;
		float: left;
		width: 255px;
		display: inline;
		clear: both;
	}	
	#maintop .update a {		
		color: #00AFEF;
	}
	#maintop .update a:hover {		
		color: #00AFEF;
	}	
/** END index top **/
6

What is the CSS for that column? Is there nothing decared in your Javascipt?