Page giving me issues. Main BG not going all the way

HTML & CSS
1

I have been stumped on this for hrs. I know I am probably missing some simple like a cosing tag or something but I cannot find it anywhere.

If you look at the page

http://wolphewebdesign.com/Clients/BTE/featured.html

You will be able to see what I am trying to do. I am using a BG image for the wide-main section but it is only going down to the first 2 products and not going with the 3rd.

Can someone please take a look at my code and see if you can see what I am missing.

Any help would be greatly appreciated

Code for middle section

<div id="wide-middle">
<div class="wide-top"><h1>New Bakery Equipment</h1></div>
<div id="wide-content">
<h2>Featured Projects</h2>

<div id="item">
<h3>Recirculating Tunnel Oven</h3>

<div class="specs">
<p class="specstxt">Manufactuer: BTE</p>
<p class="specstxt">Model: BT 100-300</p>
<p class="specstxt">Serial No: N/A</p>
<p class="specstxt">Year: 2010</p>
<p class="specstxt">Condition: New</p>
</div><!--Closes specs-->

<div class="features">
<p class="main-wide">
Features:
</p>
<ul>
<li class="item">Recirculating</li>
<li class="item">Powder&nbsp;Coated Frame and Legs</li>
<li class="item">Stainless Steel Aluminum brushed finished outer skin</li>
<li class="item">Available in PLC Touchscreen or Standard Controls</li>
<li class="item">In-feed &amp; out-feed length built to customer specifications</li>
<li class="item">Maxon Oven-Pak 415 burner sets</li>
<li class="item">Pre-wired gas trains to&nbsp;NFPA specifications</li>
<li class="item">Band take up assembly controlled pneumatically</li>
<li class="item">Non-Asbestos bat type insulation</li>
</ul>
</div><!--Closes features-->

<div class="featuredimage"><img src="images/equipment/recirculating_tunnel_oven.jpg" />
<img src="images/quote.png" /></div>

</div><!--Closes item-->
<div id="item">
<h3>BT-2 BT-4 Sandwiching Machine</h3>

<div class="specs">
<p class="specstxt">Manufactuer: BTE</p>
<p class="specstxt">Model: BT-2 &amp; BT-4</p>
<p class="specstxt">Serial No: N/A</p>
<p class="specstxt">Year: 2010</p>
<p class="specstxt">Condition: New</p>
</div>
<div class="features">
<p class="main-wide">
Features:
</p>
<ul>
<li class="item">Available in 2 Row &amp; 4 Row</li>
<li class="item">For biscuits or cracker</li>
<li class="item">Speeds up to 2500 per minute</li>
<li class="item">Round or Rectangle Shape</li>
<li class="item">Fillings-Cream, Cheese, PB &amp; Jam</li>
</ul>
</div><!--Closes featires-->
<div class="featuredimage"><img src="images/equipment/bt-2_bt4_sandwichmachine.jpg" /></div>
<img src="images/quote.png" /></div>
</div><!--Closes item-->

<div id="item">
<h3>BT-2 BT-4 Sandwiching Machine</h3>

<div class="specs">
<p class="specstxt">Manufactuer: BTE</p>
<p class="specstxt">Model: BT-2 &amp; BT-4</p>
<p class="specstxt">Serial No: N/A</p>
<p class="specstxt">Year: 2010</p>
<p class="specstxt">Condition: New</p>
</div>
<div class="features">
<p class="main-wide">Features:</p>
<ul>
<li class="item">Available in 2 Row &amp; 4 Row</li>
<li class="item">For biscuits or cracker</li>
<li class="item">Speeds up to 2500 per minute</li>
<li class="item">Round or Rectangle Shape</li>
<li class="item">Fillings-Cream, Cheese, PB &amp; Jam</li>
</ul>
</div><!--Closes features-->
<div class="featuredimage"><img src="images/equipment/bt-2_bt4_sandwichmachine.jpg" /></div>
<img src="images/quote.png" /></div>
</div><!--Closes item-->

</div><!--Closes wide-content-->

<div class="wide-middle-bottom">
<p class="sister">If you are looking for used equipment<br />Please visit our sister site: <a href="http://allfoodequip.com" class="sister">www.AllFoodEquip.com</a></p></div>

</div><!--Closes middle-wide-->

css for the middle section

#wide-middle {
	width:803px;
	height:auto;
	float:left;
	}
	
.wide-top {
	background-image:url(images/full-main-top.png);
	width:803px;
	height:95px;
	float:left;
	}
	
#wide-content {
	background-image:url(images/wide-middle-main.png);
	background-repeat:repeat-y;
	width:803px;
	height:auto;
	float:left;
	}
	
.wide-middle-bottom {
	background-image:url(images/wide-middle-bottom.png);
	width:803px;
	height:63px;
	float:left;
	}

#item {
	width:800px;
	height:auto;
	float:left;
	}
	
	
.specs {
	width:200px;
	height:150px;
	background-color:#03C;
	float:left;
	margin-left:5px;
	}
	
p.specstxt {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	color:#fff;
	font-weight:bold;
	padding:0px 0px -5px 2px;
	margin-top:2px;
	}
	
p.main-wide {
	font-family:Verdana, Geneva, sans-serif;
	font-size:16px;
	margin-left:15px;
	margin-right:25px;
	}
	
li.item {
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	}
	
.features {
	width:400px;
	height:auto;
	float:left;
	font-size:10px;
	}

.featruedimage {
	width:150px;
	height:250px;
	float:left;
	margin-top:15px;
	}
2

3 things, tho they may be more :
#1 you have MULTIPLE DIVs with#item. you can only use IDs ONCE. If you need to use an identifier more than once, use a CLASS.
#2 Why do you have #item {float:left; } if they extend across the container anyway (#item {width:800px; } that does nothing but take them out of the regular flow. Remove both float:left and width from #item ; it might simplify things for you. Also you don’t need height:auto; It is redundant, unless you are overriding a previously declared height.

OR!!!
#3 ( and here s you problem)… IN YOUR HTML , your last #item is OUTSIDE #wide-content ( which holds your bg image), if you move that lat item INSIDE #wide-content your problem should be solved.

hope that helps.

3

I looked at the #3 (#item being after the closing tag of #wide-content) and I see that it is in, unless I am missing something.

4

I just found it. I had an extra closing </div> after an image

<div class=“featuredimage”><img src=“images/equipment/bt-2_bt4_sandwichmachine.jpg” /></div>
<img src=“images/quote.png” /></div>

5

Glad you found it.
Those details will get you. It always saves a lot of headaches to validate your markup, far too often we begin by assuming it’s a CSS error. A great validation tool

6

I knew it was something simple. I even said it in the OP about a closing tag. I just couldnt find it.

I appreciate the link, will bookmark it so if I get the brain farts again…lol