need help with links on home page

[treasuresangel]

Hi, I need someone to help find the problem with my code. It has to be in the css for when I removed the image the links in the storefront (in header) work just fine. This is based on a miva purchased skin. Can anyone help? Thanks!

http://www.treasures-trinkets.com/mm...TG&Screen=SFNT


BELOW IS CSS, code for storefront will be after that.

/*------- store front edits / links -------*/

body.SFNT #left-navigation {display:none; border:none;}
#content-container {display:block; width:100%; max height: 1200px}
#home-header {width:920px; height:291px; display:block; background:transparent url(images/homePage_header.jpg) no-repeat; float:left;}
#home-header a span {display:none;}
#home-header a { position:absolute; width:920px; height:291px;}

#featured {width:920px; height:101px; display:block; background:transparent url(images/threefeatures.jpg) no-repeat; float:left; margin-top:30px;}
#featured span {display:none;}
#featured a.best { position:absolute; width:290px; height:101px;}
#featured a.custom { position:absolute; width:290px; height:101px; margin-left:300;}
#featured a.special { position:absolute; width:290px; height:101px; margin-left:590;}

#social-media {width:100px; height:44px; display:block; background:transparent url(images/social-media.jpg) no-repeat; float:left; margin-top:20px; margin-left:60px;}
#social-media span {display:none;}
#social-media a.twitter { position:absolute; width:50px; height:44px;}
#social-media a.wordpress { position:absolute; width:52px; height:44px; margin-left:50px;}

#welcome-p {width:500px; float:left; margin-top:10px;}

#productnav {width:920px; height:49px; background:transparent url(images/home-cat.jpg) no-repeat; float:left; margin-top:30px;}
#productnav span {display:none;}
#productnav a.angel { position:absolute; width:220px; height:49px;}
#productnav a.trend { position:absolute; width:230px; height:49px; margin-left:230px;}
#productnav a.college { position:absolute; width:230px; height:49px; margin-left:460px;}
#productnav a.token { position:absolute; width:230px; height:49px; margin-left:690px;}


SFNT CODE (in header)
<div id="home-header"><a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=TTJA4" title="Trend Jewelry"><span>Trend</span> </a></div>

<div id="featured">
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=KB" title="Key Biters" class="best"><span>Best Seller</span> </a>
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=CUST" title="Custom Product" class="custom"><span>Custom Product</span> </a>
<a href="http://www.treasures-trinkets.com/Flyer_PDFs/Fall-Flyer.pdf" title="Fall Specials" class="special"><span>Fall Specials</span> </a>
</div>

<div id="productnav">
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=GAIJGF" title="Guardian Angels" class="angel"><span>Guardian Angel</span> </a>
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=TTJA4" title="T&T Trend" class="trend"><span>Trend Jewelry</span> </a>
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=CLJAR" title="Licensed Collegiate" class="college"><span>Collegiate Jewelry</span> </a>
<a href="http://www.treasures-trinkets.com/mm5/merchant.mvc?Store_Code=TTG&Screen=CTGY&Category_C ode=IBTT" title="Pocket Tokens" class="token"><span>Pocket Tokens</span> </a>
</div>
<div id="welcome-p">
<h1>T&T Wholesale</h1>
<p>T&T is a wholesaler. Orders are placed with a $100.00 minimum. Orders will not be processed without your tax ID#. Please fax it to 860-643-0038 or email it to <a href="mailto:[email protected]">Customer Service.</a></p>
</div>
<div id="social-media">
<a href="http://www.twitter.com/TandTinc" title="twitter" class ="twitter"><span>Twitter</span></a>
<a href="http://tandtinc.wordpress.com" title="TandT Blog" class ="wordpress"><span>Blog</span></a>
</div>

[treasuresangel]

Re: need help with links on home page

I should add that it's the id #features that's not working.
#social-media and #productnav work just fine!

[jsdva]

Re: need help with links on home page

Look at the below two lines, you'll see the margin-left:

#featured a.custom { position:absolute; width:290px; height:101px; margin-left:300;}        
#featured a.special { position:absolute; width:290px; height:101px; margin-left:590;}

Both of those numbers need a unit, like so:

#featured a.custom { position:absolute; width:290px; height:101px; margin-left:300px;}        
#featured a.special { position:absolute; width:290px; height:101px; margin-left:590px;}

Sometimes it's the smallest things in CSS, which if not done correctly, can mess up a lot.

[treasuresangel]

Re: need help with links on home page

Thank you SOOOO much! It works! I've been staring at this thing for three days, looking at colons, semi-colons etc. and just totally missed that!

[Bruce - PhosphorMedia]

Re: need help with links on home page

CSS HINT:

write style declarations as:

.name {
parameter:value;
parameter:value;
parameter:value;
}

makes stuff easier to read.

[treasuresangel]

Re: need help with links on home page

yes that would definately help.
thanks for the input!
Anna

[jsdva]

Re: need help with links on home page

Thank you SOOOO much! It works! I've been staring at this thing for three days, looking at colons, semi-colons etc. and just totally missed that!

You are most welcome! And, best of luck with your site!