Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Font size difference from IE to FF

Font size difference from IE to FF

Locked

Views: 2,012

Results 1 to 11 of 11
This thread is locked. New replies are disabled.
10 Apr 2010, 6:56 PM
#1
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Font size difference from IE to FF

Hello, i have some problems adjusting the font size of the product description. Here is an example:
http://lemy.co.uk/oakley-conduct-sunglasses-brown-sugarvr50-brown-gradient-p-677.html
In Firefox3 the font size is smaller than in IE8
And that's only 1 of my problems. If i press the compatibility view in IE8, the whole page body shifts to the right with about 10-15px.
Can anyone help me solve these riddles?

11 Apr 2010, 12:51 PM
#2
perfect_concepts avatar

perfect_concepts

New Zenner

Join Date:
Apr 2010
Posts:
12
Plugin Contributions:
0

Re: Font size difference from IE to FF

I'm not sure how you are sizing your fonts in your css, but I've found IE and Fire fox do not see the sizes 'x-small' and 'small' etc as same thing, I use size in 'em' or 'px' and find it more precise

11 Apr 2010, 3:36 PM
#3
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Re: Font size difference from IE to FF

perfect concepts:

I'm not sure how you are sizing your fonts in your css, but I've found IE and Fire fox do not see the sizes 'x-small' and 'small' etc as same thing, I use size in 'em' or 'px' and find it more precise

Thanks for that, i am using FCK editor to list my products and i don't know how to fix this. Would it be possible perhaps to set them from the stylesheet, like to assign for small, smaller, large, etc a fixed font size in px or em?

12 Apr 2010, 12:32 AM
#4
rstevenson avatar

rstevenson

Totally Zenned

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

Re: Font size difference from IE to FF

Yes, use the stylesheet. DO NOT embed style information in the things you edit in admin. (Well, perhaps I shouldn't be that emphatic. Nothing will be harmed, but it's entirely unnecessary.)

If you really need to add stylable elements within your product info, then add DIVs or SPANs or other HTML elements with class names, then style those in the stylesheet. Makes it a heck of a lot easier to maintain in the future.

Rob

Breakfast: the most important donut of the day.

12 Apr 2010, 1:51 AM
#5
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Re: Font size difference from IE to FF

rstevenson:

Yes, use the stylesheet. DO NOT embed style information in the things you edit in admin. (Well, perhaps I shouldn't be that emphatic. Nothing will be harmed, but it's entirely unnecessary.)

If you really need to add stylable elements within your product info, then add DIVs or SPANs or other HTML elements with class names, then style those in the stylesheet. Makes it a heck of a lot easier to maintain in the future.

Rob

Thanks Rob, the problem is that i made a bit of a mess: i listed some of my products with small, some with smaller and some normal. Is there any way of making those font sizes look the same from the stylesheet?
Anyway that's my second priority. The first one is the display on older browsers. I checked it on this free website:
http://browsershots.org/http://lemy.co.uk/
and the whole center column shifts to the right. I suspect this might be from the css flyout header 1.5 that i installed not in the header, but in the main page, but i triple checked my installation and the csshover+htaccess are all as they should be. I have posted on the support forum for that mod, but no answer, i'm lost as to how to fix this :frusty:

13 Apr 2010, 2:19 PM
#6
rstevenson avatar

rstevenson

Totally Zenned

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

Re: Font size difference from IE to FF

Your best bet is to remove those size declarations.

Rob

Breakfast: the most important donut of the day.

27 Apr 2010, 11:42 AM
#7
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Re: Font size difference from IE to FF

rstevenson:

Your best bet is to remove those size declarations.

Rob

Thanks for that, I removed all the size declarations from the homepage, but the difference between center column position in ie7 and ie8. In ie6 it looks very bad, the difference is bigger and it breaks the whole website. Something must be conflicting in the stylesheet, but can't figure out what!

28 Apr 2010, 1:18 PM
#8
rstevenson avatar

rstevenson

Totally Zenned

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

Re: Font size difference from IE to FF

I couldn't figure it out either! And this might be why...

<link rel="stylesheet" type="text/css" href="min/?f=/includes/templates/cold_steel/css/style_imagehover.css,/includes/templates/cold_steel/css/stylesheet.css,/includes/templates/cold_steel/css/stylesheet_betterCategoriesEzInfo.css,/includes/templates/cold_steel/css/stylesheet_css_buttons.css,/includes/templates/cold_steel/css/stylesheet_dotline.css,/includes/templates/cold_steel/css/jqlightbox.css,/includes/templates/cold_steel/css/tpp.css,/includes/templates/cold_steel/css/tpp/alt_tpp_tabs6.css,/includes/templates/cold_steel/css/product_info.css&1271049632" />

What the heck is that? I'm not the world's greatest expert in XHTML and CSS but I can say that in working on the web since there's been a web to work on I've never seen a comma-separated list of stylesheets in the meta data, only individual metadata lines for each stylesheet. But who knows, maybe it works. But even if that works, having so many stylesheets is going to present problems.

And what's that last bit, after the ampersand? That's probably not helping. And does the tpp.css stylesheet indicate this is a Template Monster template? If so, trying to customize it can cause problems. You may need to ask the template vendor for help.

Sorry I can't be more helpful.

Rob

Breakfast: the most important donut of the day.

21 Jun 2010, 4:50 PM
#9
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Re: Font size difference from IE to FF

Sorry for such big delay, i just want to clarify in case someone else finds this post and might get the wrong idea.
The stylesheets list is the minified css sent to the browser. It includes all my css files minified by the CSS/JS Loader thus saving precious load time.
The tpp.css comes from tabbed products pro, the tabs on my product page.
I solved my problem editing the stylesheet.css where there were some confilicting width's. It took me some time, but i found the web developer plugin for firefox which helped a lot. It now works good, as far as i tested, on IE 6,7,8, FF, Opera, Safari and Chrome.

21 Jun 2010, 5:16 PM
#10
kuroi avatar

kuroi

Totally Zenned

Join Date:
Apr 2006
Location:
London, UK
Posts:
10,475
Plugin Contributions:
11

Re: Font size difference from IE to FF

andreitero:

The stylesheets list is the minified css sent to the browser. It includes all my css files minified by the CSS/JS Loader thus saving precious load time.Seems like it cost you a ton a time.

Minifying is usually worthwhile for javascript, but rarely gives more than a marginal benefit for css, especially on image heavy sites like e-stores where image optimisation is usually a much better use of time.

It should only be done for completely production sites, not ones that you're trying to debug and you'll probably get some pretty sharp responses in future here if you ask for help on a site where you've obfuscated the key data in this way.

Kuroi Web Design and Development | Twitter

(Questions answered in the forum only - so that any forum member can benefit - not by personal message)

21 Jun 2010, 6:02 PM
#11
andreitero avatar

andreitero

Zen Follower

Join Date:
Dec 2009
Posts:
207
Plugin Contributions:
0

Re: Font size difference from IE to FF

kuroi:

Seems like it cost you a ton a time.

Minifying is usually worthwhile for javascript, but rarely gives more than a marginal benefit for css, especially on image heavy sites like e-stores where image optimisation is usually a much better use of time.

It should only be done for completely production sites, not ones that you're trying to debug and you'll probably get some pretty sharp responses in future here if you ask for help on a site where you've obfuscated the key data in this way.

Both valid points, i will try disabling the C/J loader when i have a future CSS question to ask on the forum. For now, if it comes with the CSS minifying included, i will keep it because the problem is solved.