In the preview, the box looks fine, But on my site, it looks like this:

The original code styled each app picture as a background. I only did these 3 things:
1. removed the background style from the div tag
2. rewrote the code to make the picture an image instead of a background by putting the image inside an <img src> tag
3. made that img tag into a link by encasing it in a href tag, like this: <a href=''><img src=''></a>
______________________________________________________________________________
Here's the original (I will later alter the blue code, and, in particular, the yellow):
<div class="sys_download_unit" style="background-image:url(http://fightslive247.com/modules/boonex/desktop/templates/base/images/icons/desktop.png);"><div><a href="http://fightslive247.com/modules/boonex/desktop/file/desktop.air" href="">Desktop App</a></div> <p>Download our desktop application<br />and enjoy communication with site<br />members without even opening<br />your web-browser.<br />This application requires the Adobe® AIR™<br />runtime to be installed for<br /><a href="http://airdownload.adobe.com/air/mac/download/1.0/AdobeAIR.dmg">Mac OS</a> or <a href="http://airdownload.adobe.com/air/win/download/1.0/AdobeAIRInstaller.exe">Windows</a>.</p></div><div class="sys_download_unit" style="background-image:url(http://fightslive247.com/templates/base/images/icons/iphone.png);"><div><a href="http://www.boonex.com/products/mobile/iphone/" href="">iPhone App</a></div> <p>Browse profiles, watch photos andvideos, listen to shared music, upload photos, send letters and even more - all from your iPhone.</p></div>
And here's the altered:
<div class="sys_download_unit"><a href="http://fightslive247.com/modules/boonex/desktop/file/desktop.air"><img src="http://dl.dropbox.com/u/3123451/Tim%27s%20Site/desktop2.png" style="clear: right; float: right; margin-top: 6px"/></a><div><a href="http://fightslive247.com/modules/boonex/desktop/file/desktop.air" href="">Desktop App</a></div> <p>Download our desktop application and enjoy communication with site members <span style="font-weight:bold; font-style:italic">without even opening your web-browser! </span> This application requires the Adobe® AIR™runtime to be installed for <a href="http://airdownload.adobe.com/air/mac/download/1.0/AdobeAIR.dmg">Mac OS</a> or <a href="http://airdownload.adobe.com/air/win/download/1.0/AdobeAIRInstaller.exe">Windows</a>.</p></div><br /><div class="sys_download_unit"><a href="http://www.boonex.com/products/mobile/iphone/"><img src="http://dl.dropbox.com/u/3123451/Tim%27s%20Site/iphone2.png" style="float:left; clear:left; margin-top: 3px; margin-left: -2px"/></a><div><a href="http://www.boonex.com/products/mobile/iphone/" href="">iPhone App</a></div> <p>Browse profiles, watch photos and videos, listen to shared music, upload photos, send letters, and more...<span style="font-style:italic; font-weight: bold">all from your iPhone!</span></p><br/></div>
__________________________________________________________________________________
In short, this:
<div class="sys_download_unit" style="background-image:url();"><div>
became this:
<div class="sys_download_unit"><a href=""><img src="" style="clear: right; float: right; margin-top: 6px"/></a><div>
__________________________________________________________________________________________________________
And this:
<div class="sys_download_unit" style="background-image:url();"><div>
became this:
<div class="sys_download_unit"><a href=""/><img src="" style="float:left; clear:left; margin-top: 3px; margin-left: -2px"/></a><div>
____________________________________________________________________________________________________________
My CSS looks like this:
.sys_download_unit {
margin:0px 10px 10px 5px;
min-height:56px;
padding-left:1px;
}
.boxContent>.sys_download_unit:first-child{
margin-top:12px;
}
.sys_download_unit>div>a {
font-size:12px;
font-weight:bold;
}
____________________________________________________________________________________
Anyone have a clue?
