CSS for Front Page Layout and Product description

What am I missing. I Would like to use CSS instead of table, especially for the front page layout, products descriptions would be a bonus. I tried adding my style rule into the existing styles.css page, but that did not seem to work.

Is it possible to use CSS for the front page? Seems that everything is for HTML with tables only.

Thanks for any Help;


Hi Gerald,

Let us know the version of Cs-cart you use. Add ?version after index.php/

All #2 versions work with divs only!

So you are missing something if you use version 2.x.

Are you familiar with Firefox firebug?

Also you could have a look at http://docs.cs-cart.com/common.php?dispatch=docs/view&node_name=design-template-scheme for a general idea, and then try your CSS changes.

Let me know how it works out for you.


Thank You for your reply,

The cart version that I am working on is 2.2.4

Yes I have firebug and I understand how to change the basic look and feel of the site.

The DOC section is very informative, but still could not find a reference to my question.

Where I am having problems when I am in the admin/blocks/homepage/Welcome to C-S cart section, I want to use CSS in the section of html. Problem is I cannot link my CSS to a directory, as I cannot find a way of doing the link, or if there is a link, I cannot find it.



If you are trying to have more than one block wide, the cart puts the blocks into tables, which makes no sense. To top that off, it puts a 10px wide column between the blocks, which makes it super annoying.

The best thing to do would be to create a new block template with your code. Then upload the block to your skins/your-skin/customer/blocks folder.

Then select this new block in your admin.

Sure, this isn't the best solution since it isn't dynamic, but it is the best that I know of.

Hope that helps,


Thank you for your tip,

The only thing I want to do is to be able to use style sheets inside the home page block. I am amazed that we are forced to design with HTML tables.


You should be able to put in your own styles just fine. I have done this tons of times, even with custom tabs, and haven't had a problem.

Sure, if you have more than one block wide, the cart puts the blocks into tables, but if you just have one block, you can easily just use your own styles.

Here is an example of the tabs that I use:


This is the tab one header

This is the tab two header

This is the tab three header


And here are the styles that go with that:

```php .usual {
background: none repeat scroll 0 0 #181818;
color: #111111;
margin: 8px auto;
padding: 0;
width: 770px;
.usual ul {
margin:0 0 0 22px;
.usual li {
float: left;
list-style: none;
.usual ul li {
.usual ul a {
background: none repeat scroll 0 0 #444444;
color: #FFFFFF;
display: block;
font-size: 14px;
margin: 1px;
padding: 6px 12px;
text-align: center;
text-decoration: none !important;
.usual ul a.selected {
background: none repeat scroll 0 0 snow;
border-bottom: 1px solid snow;
color: #000000;
cursor: default;
margin-bottom: 0;
.usual div {
background: none repeat scroll 0 0 snow;
clear: left;
font: 10pt Georgia;
padding: 10px 0 8px;
} ```

Basically I just created this in Dreamweaver and then copy/paste the code into my html block. Of course, you need to do it in source view, but that is about it.

The other thing to try is to go into settings => General and turn the WYSIWYG editor off. Then go and change your block. I think I use the Tiny editor, but it and I think the other one will toss

tags around your content and screw it all up. If you disable the editor first, you won't have this problem.

Hopefully this helps a bit more.



Thank you so much,

This appears to be exactly what I want to do.

However I will try to completely implement everything tomorrow as it is getting to late this evening.