X-Cart forums

[SystemSkins]

Can someone help me out here...

When viewing my site http://www.systemskins.com/sscart/home.php It looks great in FF. But when you view it in IE the hover links in the controller are shifted.

My code for head.tpl

{* $Id: head.tpl,v 1.58.2.1 2007/09/03 06:15:21 max Exp $ *}
<table class="HeaderBG" cellpadding="0" cellspacing="0" width="970px" height="261">
<tr><td class="HeadRightHome" height="15px" width="100%" colspan="3"><a href="{$http_location}/">Home</a></td>
</tr>
<tr>
<td class="HeadLeftBox" width="50%"><a href="{$http_location}/"><img src="{$ImagesDir}/header_logo.gif" width="300" height="120" alt="System Skins" /></a></td>
    <td width="35%" class="HeadRightAccount"><a href="../register.php">My<br />Account</td>
    <td width="15%" class="HeadRightCart"><a href="../cart.php">My<br />Cart</a></td>
</tr>
</table>
<table class="HeaderBGbottom" cellpadding="0" cellspacing="0" width="100%" height="196">
<form action="{$xcart_web_dir}/include/login.php" method="post" name="toploginform">
<input type="hidden" name="mode" value="logout" />
<input type="hidden" name="redirect" value="{$redirect|escape}" />    
<tr><td height="100%" width="33%"><img src="{$ImagesDir}/spacer.gif" width="1" height="1"/></td>
<td height="100%" width="34%"><img src="{$ImagesDir}/spacer.gif" width="1" height="1"/></td>
<td height="100%" align="right" width="33%" valign="bottom" nowrap="nowrap" class="FLCAuthBox">
<img src="{$ImagesDir}/spacer.gif" width="1" height="1"/>
{if $login ne ""}<b>{$login} </b>{$lng.txt_logged_in}
{if $js_enabled}
{include file="buttons/button.tpl" button_title=$lng.lbl_logoff href="javascript: document.toploginform.submit();" js_to_href="Y"}
{else}
{include file="buttons/logout_menu.tpl"}
{/if}
    </td>
{/if}
</tr>
</table>
</form>

I'm trying to make the hover links in the controller white with a red highlight on mouseover but if I change that then the titles of my products change to white too. I've tried to separate this but cant seam to do so. I thought that by having this CSS code would work for the hover buttons but it does't, it takes on the A:link and A:visited style. I thought that by indicating <td class="HeadRightHome" >it would effect the <a href=""> tag but its not changing the link properties. It changed the center and padding but not the link properties.

A:link {
    COLOR: #000000;
    TEXT-DECORATION: none;
}
A:visited {
    COLOR: #000000;
    TEXT-DECORATION: none;
}
A:hover {
    COLOR: #FF0000;
    TEXT-DECORATION: underline;
}
.HeadRightHome {
    TEXT-ALIGN: right;
    TEXT-DECORATION: none;
    COLOR: #FFFFFF;
    PADDING-RIGHT: 249px;
    PADDING-TOP: 25px;
}

Also, When a customer logs in it says "username" is logged in! There is also a "Log out" with a button next to it but it places this underneath the "username" is logged in! I want this all on one line. I can't find where/why it's doing this. How do I make this all on one line?

Thanks,

Doug

[Jonjolt1]

You need to create a sperate class like

.ControllerLink
{
text size color etc
}
.ControllerLink:hover
{
what changes
}

And insert a class in the anchor tag like <a class="ControllerLink" href="......>

[SystemSkins]

ok thanks, i'll do that.

What about the position of the text links in IE vs FF? They look fine in FF but in IE they are are moved out of position.

[SystemSkins]

I've fixed the color and hover color for the links but I'm still having the alignment problem. It looks great in FF but IE they are all out of position. Does anyone know how to fix this? I been trying all sorts of things and can't seam to get it to work. Can't find anything on the web either.