X-Cart forums

[vasilis]

This is a purely CSS question, regardless of xcart.

I have a problem with an inconsistency between Firefox and IE7 (and I guess IE8 as well, but I haven't checked it) regarding a page in my test site with url: http://www.zoomseri.temporaryurl.biz/home.php?display_cats=Y
Specifically, the vertical distance of the breadcrumbs links (i.e. "Zoomserie" breadcrumb link in that particular page) from the upper 2-rounded corner main part of the page is much greater in IE7 than in Firefox (see attached image, the red double-arrowhead line depicts the distance under discussion).

Actually if you check the page with Firebug, you will see that there are 2 divs inside the "center" div which is the central part of the page (which includes the left, one-link navigation menu and the central part with the root categories, sorry the language is in Greek but that should not be an issue for the current post). These div's are namely, "topban" and "center-main". Now, inside the "center-main" div there is the "location" div among other, which displays the breadcrumbs links. Both "topban" and "center-main" divs have 0 top and bottom margins. Firefox displays the layout correctly, but IE7 adds a non-existent vertical space above the location link. The link should be positioned where the "topban" div with the 2 rounded corners finishes. I know that IE generally is the main culprit in CSS rendering, but I was wondering if there is any css hack.

Appreciate any tips.

[cflsystems]

div id=location
has margin-top=40px in IE

[vasilis]

Steve, where do you see this 40px top margin, because I have set it to 0px. I can check it in Firebug as well that it is 0px (both in 'Style' and 'Computed' tab of Firebug).

[vasilis]

ok Steve, I fixed it. With your reply, I got the chance to install IE Developer Toolbar, I didn't know that there was such a tool for IE (I do most of the work in Firefox and I just check the sites in IE when I finish each stage), and I traced the 40 px top-margin in the main_vas.IE7.css style sheet. I couldn't trace that from Firebug, since this top-margin is located in another style sheet which is rendered only when IE is the browser. (a IE7 specific style sheet)
thanks for the help

[cflsystems]

Good work. That's how I found it in the first place. IE Dev Toolbar is a joke compare to Firebug but at least gives some idea whats going on in IE