Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls
X-Cart Home FAQ Forum rules Calendar User manuals Login  

How to disable the .css file for an individual template???

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design
Page 1 of 2 1 2 >
 
Thread Tools Search this Thread
  #1  
Old 03-15-2005, 09:42 AM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default How to disable the .css file for an individual template???
Does anyone know how to disable the .css file for one .tpl file? I have created a head_nav.tpl, but the css file is formatting the text for me. If I remove the TD formatting from the .css , my nav bar looks like I want it to , but the rest of the document loses some formatting.

How can I use a .tpl file that does not rely on the skin1.css file ? THANKS!

Version 3.5.14
Reply With Quote
  #2  
Old 03-15-2005, 09:45 AM
 
balinor balinor is offline
 

Veteran
   
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 
Default
You really can't, since it is hard coded into home.tpl. Why not just apply a new style to items in head_nav.tpl to overwrite the style called from the TD?
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #3  
Old 03-15-2005, 11:23 AM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default
Thanks for the quick reply. How do you call the seperate style sheet ? I have tried adding formatting to the .tpl file, but the skin1.css over-rides it. Is there a way to call a seperate style sheet from head_nav.tpl ?
Reply With Quote
  #4  
Old 03-15-2005, 11:29 AM
 
balinor balinor is offline
 

Veteran
   
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 
Default
Don't try to override the style sheet...simply add a new style to the stylesheet and add the formatting to the element you want to format. For example, say you have a line of text you want to appear different in your new template, let's call it link1. To apply a style, surround it with a span tag like this:

<span class="style1">link1</span>

You would then have to create a style1 class in skin1.css. Now the link1 text will appear using style1 formatting. That make sense?
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #5  
Old 03-15-2005, 11:34 AM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default
OK, I didnt think of doing it that way , I was thinking I needed a new style sheet. I will try it like that thanks!
Reply With Quote
  #6  
Old 03-15-2005, 11:52 AM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default
OK I tried that and it didnt work. The only way I can get the top bar how I want it to look is to remove the TD,TH, and P from the top part of the skin1.css. But, when I do that, the rest of the page is affected.

Here is my code for skin1.css

Code:
BODY,INPUT,TD,TH,P,SELECT,TEXTAREA {
        FONT-FAMILY: Arial; 
        COLOR: #000000; FONT-SIZE: 10px;
}

TopBar { FONT-FAMILY: Arial; 
        COLOR: #001683; FONT-SIZE: 14px;
}


A:link {
        COLOR: #000000; TEXT-DECORATION: none;
}
A:visited {
        COLOR: #000000; TEXT-DECORATION: none;
}
A:hover {
        COLOR: #FF4421;
}
A:active  {
        COLOR: #000000; TEXT-DECORATION: none;
}
H1 {
        FONT-SIZE: 15px;
}
H2 {
        FONT-SIZE: 13px;
}
H3 {
        FONT-SIZE: 12px;
}
HR {
        COLOR: #DDDDDD; HEIGHT: 1px;
}
BODY { 
        MARGIN-TOP: 0 px; MARGIN-BOTTOM: 0 px; MARGIN-LEFT: 0 px; MARGIN-RIGHT: 0 px; 
        BACKGROUND-COLOR: #ffffff;
}
.HeadBox {
        BACKGROUND-COLOR: #FF0000;
}
.HeadText {
        FONT-SIZE: 12px; FONT-WEIGHT: bold;
}
.HeadLine {
        BACKGROUND-COLOR: #C3CCD0;
}
.VertMenuBox {
        BACKGROUND-COLOR: #CCCCCC;
}
.VertMenuBorder {
        BACKGROUND-COLOR: #FF3300;
}
.VertMenuTitle {
        BACKGROUND-COLOR: #FF0000; COLOR: #ffffff; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.VertMenuItems {
        COLOR: #333333; TEXT-DECORATION: none;
}

.VertMenuItems:link {
        COLOR: #333333; TEXT-DECORATION: none;
}
.VertMenuItems:visited {
        COLOR: #333333; TEXT-DECORATION: none;
}
.VertMenuItems:hover {
        COLOR: #FF4421; TEXT-DECORATION: underline;
BACKGROUND-COLOR: #ffffff;
}
.VertMenuItems:active  {
        COLOR: #000000; TEXT-DECORATION: none;
}
.VertMenuHr {
        COLOR: #999999;
}
.CategoriesList {
	FONT-SIZE: 14px; FONT-WEIGHT: bold;
}
.DialogBox {
        BACKGROUND-COLOR: #ffffff;
}
.DialogBorder {
        BACKGROUND-COLOR: #FF4421;
}
.DialogTitle {
        BACKGROUND-COLOR: #ECEFF3; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px;
}
.NumberOfArticles {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.TopLabel {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Text {
        COLOR: #000000;
}
.AdminSmallMessage {
        COLOR: #FF3300;
}
.AdminTitle {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Line {
        BACKGROUND-COLOR: #FF6600;
}
.ProductTitle {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductDetailsTitle {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductDetails {
        COLOR: #000000;
}
.ProductPriceTitle {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceConverting {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPrice {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceSmall {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.MarketPrice {
        FONT-SIZE: 11px;
}
.ItemsList {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.NavigationPath {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.FormButton {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.Button {
       FONT-FAMILY: Arial;
	   BACKGROUND: URL(images/butbg.gif);
       BACKGROUND-COLOR: #FF4421;
       COLOR: #FFFFFF; FONT-WEIGHT: bold; 
       FONT-SIZE: 11px;
       TEXT-DECORATION: none;
}
.CustomerMessage {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.ErrorMessage {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.Star {
        COLOR: #FF0000;
}
.HighLight {
		BACKGROUND-COLOR: #FFFFCC;
}
.SaveMoneyLabel {
        COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.TableHead {
    BACKGROUND-COLOR: #DDDDDD;
}
.SmallNote:link {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:visited {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:hover {
        COLOR: #888888; TEXT-DECORATION: underline; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif; 
}
.SmallNote:active {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.Bottom {
        BACKGROUND-COLOR: #000000; COLOR: #FFFFFF;
}
.Tab {
        BACKGROUND-COLOR: #C3CCD0;
        FONT-WEIGHT: bold;
    TEXT-TRANSFORM: uppercase;
}
.CatMenuItemOff 
{
    BACKGROUND-COLOR: transparent;	/* like "VertMenuBox" */
    BORDER-RIGHT: none;				/* like "VertMenuBox" */
    BORDER-TOP: none;				/* like "VertMenuBox" */
    BORDER-LEFT: none;				/* like "VertMenuBox" */
    BORDER-BOTTOM: none;			/* like "VertMenuBox" */
    MARGIN-BOTTOM: 1px;
    MARGIN-TOP: 1px;
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px;
    CURSOR: pointer;
}
.CatMenuItemOffExp
{
    BACKGROUND-COLOR: transparent;	/* like "VertMenuBox" */
    BORDER-RIGHT: none;				/* like "VertMenuBorder" */
    BORDER-TOP: none;				/* like "VertMenuBorder" */
    BORDER-LEFT: none;				/* like "VertMenuBorder" */
    BORDER-BOTTOM: none;			/* like "VertMenuBorder" */
    MARGIN-BOTTOM: 1px;
	MARGIN-TOP: 1px;
	MARGIN-LEFT: 1px;
    MARGIN-RIGHT: 2px;  
    CURSOR: pointer;
}
.CatMenuItemOn 
{
    BACKGROUND-COLOR: #FF4421;              /* like "VertMenuTitle" */
    BORDER-RIGHT: #FF4421 1px solid;        /* like "VertMenuTitle" */
    BORDER-TOP: #FF4421 1px solid;          /* like "VertMenuTitle" */
    BORDER-LEFT: #FF4421 1px solid;         /* like "VertMenuTitle" */
    BORDER-BOTTOM: #FF4421 1px solid;       /* like "VertMenuTitle" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
    CURSOR: pointer;
}
.CatSubMenu
{
    BACKGROUND-COLOR: #C3CCD0;              /* like "VertMenuBox" */
    BORDER-RIGHT: #000000 1px solid;        /* like "VertMenuBorder" */
    BORDER-TOP: #000000 1px solid;          /* like "VertMenuBorder" */
    BORDER-LEFT: #000000 1px solid;         /* like "VertMenuBorder" */
    BORDER-BOTTOM: #000000 1px solid;       /* like "VertMenuBorder" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
}
.CatMenuItem
{
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial; 
    CURSOR: pointer;
}
.CatMenuItem:link
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.CatMenuItem:visited
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.CatMenuItem:hover
{
    COLOR: #FFFFFF;                         /* like "VertMenuTitle" */
}
.CatMenuItem:active
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.StatisticsBar {
	BACKGROUND-COLOR: #A8BCC8;
}

Here is the head_nav.tpl

Code:
<span class="TopBar">

<table border="0" cellpadding="0" style="border-collapse: collapse" width="100%" height="37">
	<tr>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="109">
		<p align="center"><font color="#001683" face="Arial">Home </font>
		</td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="109">
		<font color="#001683" face="Arial">| </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="109">
		<font color="#001683" face="Arial">Contact Us </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="109">
		<font color="#001683" face="Arial">| </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="109">
		<font color="#001683" face="Arial">About Us</font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="110">
		<font color="#001683" face="Arial">| </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="110">
		<font color="#001683" face="Arial">Shipping </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="43">
		<font color="#001683" face="Arial">| </font></td>
		<td background="http://www.nowperformance.com/shop/barbg.gif" width="177">
		<font color="#001683" face="Arial">Payment Options </font>
		</td>
	</tr>
</table>


</span>

As you can see if you visit the page, the top bar is not formatted nicely. Once I remove the TD, TH, and P from the top of the skin1.css , it makes my bar how I want it.......
Reply With Quote
  #7  
Old 03-15-2005, 12:03 PM
 
balinor balinor is offline
 

Veteran
   
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 
Default
Ok, you have the right concept, but you aren't quite there. Putting a span tag around the whole template isn't going to do it, you need to apply the styles to individual items. You also shouldn't be using <font> tags or using the 'background' tag, as those are depreicated tags and may not work correctly on newer browsers. Also, the way you have your images called is not quite right. Here's what you need to do:

1. Edit your topbar style to look like this:

Code:
TopBar { FONT-FAMILY: Arial;
        COLOR: #001683; FONT-SIZE: 14px;
BACKGROUND: URL(images/barbg.gif); font-weight: bold; text-align: center; font-style: italic;
}

2. Move your background image (barbg.gif) to the x-cart images folder, which is shop/skin1/images.

3. Now change the way you have the TD tags configured on your template to look like this one:

Code:
<td class="TopBar" width="109">Home</td>

4. Get rid of the span tag you added to the template.

This will not only shrink the size of the code, but it will allow you to globally edit the template without having to edit each and every TD tag when you want to adjust the fonts or colors.

Let me know if that works for you.
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #8  
Old 03-15-2005, 12:21 PM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default
I still think somehow the skin1.css is over-writing it. Here is what I have now

skin1.css

Code:
BODY,INPUT,TD,TH,P,SELECT,TEXTAREA {
        FONT-FAMILY: Arial; 
        COLOR: #000000; FONT-SIZE: 10px;
}

TopBar { FONT-FAMILY: Arial; 
        COLOR: #001683; FONT-SIZE: 14px; 
BACKGROUND: URL(images/barbg.gif); font-weight: bold; text-align: center; font-style: italic; 
} 

A:link {
        COLOR: #000000; TEXT-DECORATION: none;
}
A:visited {
        COLOR: #000000; TEXT-DECORATION: none;
}
A:hover {
        COLOR: #FF4421;
}
A:active  {
        COLOR: #000000; TEXT-DECORATION: none;
}
H1 {
        FONT-SIZE: 15px;
}
H2 {
        FONT-SIZE: 13px;
}
H3 {
        FONT-SIZE: 12px;
}
HR {
        COLOR: #DDDDDD; HEIGHT: 1px;
}
BODY { 
        MARGIN-TOP: 0 px; MARGIN-BOTTOM: 0 px; MARGIN-LEFT: 0 px; MARGIN-RIGHT: 0 px; 
        BACKGROUND-COLOR: #ffffff;
}
.HeadBox {
        BACKGROUND-COLOR: #FF0000;
}
.HeadText {
        FONT-SIZE: 12px; FONT-WEIGHT: bold;
}
.HeadLine {
        BACKGROUND-COLOR: #C3CCD0;
}
.VertMenuBox {
        BACKGROUND-COLOR: #CCCCCC;
}
.VertMenuBorder {
        BACKGROUND-COLOR: #FF3300;
}
.VertMenuTitle {
        BACKGROUND-COLOR: #FF0000; COLOR: #ffffff; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.VertMenuItems {
        COLOR: #333333; TEXT-DECORATION: none;
}

.VertMenuItems:link {
        COLOR: #333333; TEXT-DECORATION: none;
}
.VertMenuItems:visited {
        COLOR: #333333; TEXT-DECORATION: none;
}
.VertMenuItems:hover {
        COLOR: #FF4421; TEXT-DECORATION: underline;
BACKGROUND-COLOR: #ffffff;
}
.VertMenuItems:active  {
        COLOR: #000000; TEXT-DECORATION: none;
}
.VertMenuHr {
        COLOR: #999999;
}
.CategoriesList {
	FONT-SIZE: 14px; FONT-WEIGHT: bold;
}
.DialogBox {
        BACKGROUND-COLOR: #ffffff;
}
.DialogBorder {
        BACKGROUND-COLOR: #FF4421;
}
.DialogTitle {
        BACKGROUND-COLOR: #ECEFF3; COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 11px;
}
.NumberOfArticles {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.TopLabel {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Text {
        COLOR: #000000;
}
.AdminSmallMessage {
        COLOR: #FF3300;
}
.AdminTitle {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.Line {
        BACKGROUND-COLOR: #FF6600;
}
.ProductTitle {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductDetailsTitle {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductDetails {
        COLOR: #000000;
}
.ProductPriceTitle {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceConverting {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPrice {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 12px;
}
.ProductPriceSmall {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.MarketPrice {
        FONT-SIZE: 11px;
}
.ItemsList {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.NavigationPath {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.FormButton {
        COLOR: #000000; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.Button {
       FONT-FAMILY: Arial;
	   BACKGROUND: URL(images/butbg.gif);
       BACKGROUND-COLOR: #FF4421;
       COLOR: #FFFFFF; FONT-WEIGHT: bold; 
       FONT-SIZE: 11px;
       TEXT-DECORATION: none;
}
.CustomerMessage {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.ErrorMessage {
        COLOR: #FF3300; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.Star {
        COLOR: #FF0000;
}
.HighLight {
		BACKGROUND-COLOR: #FFFFCC;
}
.SaveMoneyLabel {
        COLOR: #FFFFFF; FONT-WEIGHT: bold; FONT-SIZE: 10px;
}
.TableHead {
    BACKGROUND-COLOR: #DDDDDD;
}
.SmallNote:link {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:visited {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:hover {
        COLOR: #888888; TEXT-DECORATION: underline; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif; 
}
.SmallNote:active {
        COLOR: #888888; TEXT-DECORATION: none; FONT-SIZE: 9px; FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.Bottom {
        BACKGROUND-COLOR: #000000; COLOR: #FFFFFF;
}
.Tab {
        BACKGROUND-COLOR: #C3CCD0;
        FONT-WEIGHT: bold;
    TEXT-TRANSFORM: uppercase;
}
.CatMenuItemOff 
{
    BACKGROUND-COLOR: transparent;	/* like "VertMenuBox" */
    BORDER-RIGHT: none;				/* like "VertMenuBox" */
    BORDER-TOP: none;				/* like "VertMenuBox" */
    BORDER-LEFT: none;				/* like "VertMenuBox" */
    BORDER-BOTTOM: none;			/* like "VertMenuBox" */
    MARGIN-BOTTOM: 1px;
    MARGIN-TOP: 1px;
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px;
    CURSOR: pointer;
}
.CatMenuItemOffExp
{
    BACKGROUND-COLOR: transparent;	/* like "VertMenuBox" */
    BORDER-RIGHT: none;				/* like "VertMenuBorder" */
    BORDER-TOP: none;				/* like "VertMenuBorder" */
    BORDER-LEFT: none;				/* like "VertMenuBorder" */
    BORDER-BOTTOM: none;			/* like "VertMenuBorder" */
    MARGIN-BOTTOM: 1px;
	MARGIN-TOP: 1px;
	MARGIN-LEFT: 1px;
    MARGIN-RIGHT: 2px;  
    CURSOR: pointer;
}
.CatMenuItemOn 
{
    BACKGROUND-COLOR: #FF4421;              /* like "VertMenuTitle" */
    BORDER-RIGHT: #FF4421 1px solid;        /* like "VertMenuTitle" */
    BORDER-TOP: #FF4421 1px solid;          /* like "VertMenuTitle" */
    BORDER-LEFT: #FF4421 1px solid;         /* like "VertMenuTitle" */
    BORDER-BOTTOM: #FF4421 1px solid;       /* like "VertMenuTitle" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
    CURSOR: pointer;
}
.CatSubMenu
{
    BACKGROUND-COLOR: #C3CCD0;              /* like "VertMenuBox" */
    BORDER-RIGHT: #000000 1px solid;        /* like "VertMenuBorder" */
    BORDER-TOP: #000000 1px solid;          /* like "VertMenuBorder" */
    BORDER-LEFT: #000000 1px solid;         /* like "VertMenuBorder" */
    BORDER-BOTTOM: #000000 1px solid;       /* like "VertMenuBorder" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
}
.CatMenuItem
{
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial; 
    CURSOR: pointer;
}
.CatMenuItem:link
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.CatMenuItem:visited
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.CatMenuItem:hover
{
    COLOR: #FFFFFF;                         /* like "VertMenuTitle" */
}
.CatMenuItem:active
{
    COLOR: #000000;                         /* like "VertMenuItems" */
}
.StatisticsBar {
	BACKGROUND-COLOR: #A8BCC8;
}

and for the head_nav.tpl I am just trying a small area for now

Code:
<table border="0" cellpadding="0" style="border-collapse: collapse" width="100%" height="37">
	<tr>
<td class="TopBar" width="109">Home</td>
</tr>
</table>

Some of the bad coding comes from me being lazy and using front page for some crude coding. Theoretically this should work like it is correct? Right now, the background is not showing up and the text is not formatted.....
Reply With Quote
  #9  
Old 03-15-2005, 12:45 PM
 
balinor balinor is offline
 

Veteran
   
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 
Default
Ok, just as a test, replace this:

<td class="TopBar" width="109">Home</td>

with this:

<td width="109"><span class="TopBar">Home</span></td>

If that works, we'll deal with the image background for the table cell as a seperate style.
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #10  
Old 03-15-2005, 12:53 PM
 
Dowhatchalike Dowhatchalike is offline
 

Advanced Member
   
Join Date: May 2004
Posts: 84
 
Default
First of all thanks for the help!

That didnt do anything, looks the same as before....

Maybe we are over-thinking this thing. Perhaps I should just use some sort of image map to just use a flat graphic and make it link that way ?

I originally tried to use a javascript but the skin1.css file interfered with that too ..

Any other ideas on this or should I just scrap it and try something else ?
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions > Changing design
Page 1 of 2 1 2 >

« Previous Thread | Next Thread »


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 08:51 AM.

   
 
X-Cart forums © 2001-2020