Forums / Templates, Stylesheets, Page Layout / CSS add to cart button and style

CSS add to cart button and style

Locked

Views: 30,780

Results 1 to 8 of 8
This thread is locked. New replies are disabled.
6 Nov 2008, 6:09 PM
#1
uhu2 avatar

uhu2

New Zenner

Join Date:
Dec 2007
Posts:
13
Plugin Contributions:
0

CSS add to cart button and style

Hello,

I recently changed my buttons to CSS. They seem fine except that I have style="width: 110px;" that is automatically written at the end of the add to cart button code. Because of that the button is too small for my font size and some of the text is hidden.
I don't know where to remove this style="width: 110px;" from the template code.

In my product page source you can find

<!--bof Add to Cart Box -->
              <div id="cartAdd"> the button code is here with style="width: 110px;" in it.

I use Zencart 1.3.7 in French

Please help,

Thanks

6 Nov 2008, 9:23 PM
#2
uhu2 avatar

uhu2

New Zenner

Join Date:
Dec 2007
Posts:
13
Plugin Contributions:
0

Re: CSS add to cart button and style

Actually, it's more than that. I have this code defining width on all buttons. It's really a problem.
Can you tell me where to remove style="width: xxxpx" for all buttons ?

Thank you

7 Nov 2008, 9:00 PM
#3
rstevenson avatar

rstevenson

Totally Zenned

Join Date:
Nov 2006
Location:
Dartmouth, NS Canada
Posts:
2,400
Plugin Contributions:
0

Re: CSS add to cart button and style

I too had this problem. I got it mostly fixed following these two threads last year...

first thread

second thread

HTH

Rob

Breakfast: the most important donut of the day.

7 Nov 2008, 10:04 PM
#4
paulm avatar

paulm

Totally Zenned

Join Date:
Nov 2003
Posts:
1,878
Plugin Contributions:
5

Re: CSS add to cart button and style

I got so tired about explaining the differences between the included Zen Cart CSS buttons and the CSS buttons addon, that I actually had given up all of it a long time ago, but I am quite sure using the latest CSS buttons addon will help to solve this issue.

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=272

8 Nov 2008, 2:17 PM
#5
uhu2 avatar

uhu2

New Zenner

Join Date:
Dec 2007
Posts:
13
Plugin Contributions:
0

Re: CSS add to cart button and style

Hello,

Thank you very much. I tried to tweak Zencart code but unsuccessfully. I will try the plugin instead. It looks really interesting.
Do you know if the the problem is solved in Zencart 1.3.8?
I guess not as I saw that the plugin was available for that version too but I felt I should ask.

Kind regards

8 Nov 2008, 2:52 PM
#6
rstevenson avatar

rstevenson

Totally Zenned

Join Date:
Nov 2006
Location:
Dartmouth, NS Canada
Posts:
2,400
Plugin Contributions:
0

Re: CSS add to cart button and style

It's really two problems: legacy code, as you noted in your original question. I believe this sort of thing is going away with v1.4, whenever it comes out.

But there is also some sort of problem with CSS cascading down into forms, and some browsers not dealing well with it. I know that even with the newest version of the CSS Buttons contrib a few buttons on both my sites don't look the same as the others in some browsers (i.e, IE).

I'll be upgrading my stores to 1.4 and re-designing them somewhat at the same time. We'll see if that cascade problem goes away then.

Rob

Breakfast: the most important donut of the day.

8 Nov 2008, 4:38 PM
#7
uhu2 avatar

uhu2

New Zenner

Join Date:
Dec 2007
Posts:
13
Plugin Contributions:
0

Re: CSS add to cart button and style

Thank you rstevenson,

Yes pure CSS seems essential today. Beautiful site. I couldn't see your CSS for buttons though.
I'll let you know how it goes for me.

I'll just wait for version 1.4 then.

I also thank paulm for his contribution.

Have a nice week-end.

9 Nov 2008, 1:34 PM
#8
rstevenson avatar

rstevenson

Totally Zenned

Join Date:
Nov 2006
Location:
Dartmouth, NS Canada
Posts:
2,400
Plugin Contributions:
0

Re: CSS add to cart button and style

UHU2:

I couldn't see your CSS for buttons though.

Do you use the Web Developer tools? In them you can select CSS/View CSS and it makes a new window (or tab) showing all the stylesheets used on any page. In the case of my sites, it shows stylesheet.css, stylesheet_css_buttons.css, and print_stylesheet.css. It has little symbols that allow you to collapse each of the stylesheets, so you can view just the one you're looking for.

There are many other things you can do with the Web Developer tools. For Firefox, just get them from the add-ons section of the Firefox web site, under the web development category.

Rob

Breakfast: the most important donut of the day.