Make Website Display the same in Explorer & Firefox

[ljdream00]

Hello Zen Family,
please help if you can!!!

Please look at the two attached pictures.
The correct picture shows the perfect alignment that I want to show and it's shown in Explorer.

The next picture shows how it looks in Firefox.

Can someone help me understand what I am doing wrong or how I can align both sites to look the same?

I'm currently revising this on my localhost so I do not have this uploaded on the net.
But the current site is: www.lacefrontsecrets.com

The current website has the same issue with not looking the same in firefox verses explorer.

Thank you in advance for your quick responses.
lj

[ljdream00]

anybody???know what I can do to resolve this issue?

[kuroi]

Sorry, but these types of problems are usually about the interplay between generated HTML and CSS and are very difficult, if not impossible, to diagnose from static images, as we don't know what changes you have made.

In this case it is made even more difficult by this being a Template Monster template which means we don't even know the starting code or CSS, only that it will bear no relationship to normal Zen Cart code.

[NHRADeuce]

Like Kuroi said, this type of problem is hard to diagnose from images. If I had to guess, there is an issue with your CSS that IE doesn't like. That's actually not unusual since IE doesn't strictly follow CSS standards. IE7 is better but still messed up. I just finished putting together a fix for screwy IE6/IE7 CSS related problems. It's easy enough to make IE specific fixes for CSS then only load those files when needed. I added this code to my /TEMPLATE/common/html_header.php file

/**
 * load all template-specific stylesheets, named like "ie6*.css", alphabetically
 */
     echo '<!--[if lte IE 6]>';
  $directory_array_ie6 = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^ie6/', '.css');
  while(list ($key, $value) = each($directory_array_ie6)) {
    echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />'."\n";
  }
    echo '<![endif]-->';
/**

 * load all template-specific stylesheets, named like "ie7*.css", alphabetically
 */
     echo '<!--[if IE 7]>';
  $directory_array_ie6 = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^ie7/', '.css');
  while(list ($key, $value) = each($directory_array_ie6)) {
    echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />'."\n";
  }
    echo '<![endif]-->';
/** 

Jut put this after all of the other CSS code. I just put it at the bottom of the page before the ?></head>.

Any time you have a display problem you just put the fix in your IE specific CSS files. Just use the naming convention ie6*.css and ie7*.css similar to your other CSS overrides.

[kuroi]

Or there is a mod that in the downloads section that does this for you ... assuming that your template is building the document header in the normal way.

[Website Rob]

kuroi, the Mod you mention is a bit outdated, is it not?

Version: v1
Last Updated: Feb 25 2007

Also, Alan made mention of his updates on Nov. 05, 2007 and there is the fact that this file can/will change, from version to version of Zen Cart.

includes/templates/templates_default/common/html_header.php

This has already happened in 1.3.8a


I think NHRADeuce is on to something, just manually adding the code as one goes along. As it only has to be done once each version it seems like a simple thing to do.


While we're on the Subject though, can someone explain what the the 'lte' or 'lt' means in: if lte IE 6

[kuroi]

Depends which version of Zen Cart the poster is using , but yes you're right, though it won't be for very long .

The lt or lte mean "less than" and "less than or equal" respectively.

[Website Rob]

you're right, though it won't be for very long

Is that a teaser?

[NHRADeuce]

Or there is a mod that in the downloads section that does this for you ... assuming that your template is building the document header in the normal way.

LOL. I searched and searched for this last night and couldn't find it! I kept looking for CSS and I must have gone right over this contribution so I just wrote one myself. Our code is very similar, but I like yours better.

kuroi, the Mod you mention is a bit outdated, is it not?

Version: v1
Last Updated: Feb 25 2007

Also, Alan made mention of his updates on Nov. 05, 2007 and there is the fact that this file can/will change, from version to version of Zen Cart.

includes/templates/templates_default/common/html_header.php

This has already happened in 1.3.8a


I think NHRADeuce is on to something, just manually adding the code as one goes along. As it only has to be done once each version it seems like a simple thing to do.


While we're on the Subject though, can someone explain what the the 'lte' or 'lt' means in: if lte IE 6

Actually, the mods are almost exactly the same. I just separated the code out for people who have a modded html_header.php. The same can be done for this contribution. Here is that code -

/**
 * load all template-specific stylesheets, named like "ie_*.css", alphabetically
 * for stylesheets targeted at all versions of IE
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^ie_/', '.css');
  while(list ($key, $value) = each($directory_array)) {
    echo '<!--[if IE]>' . "\n";
      echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />' . "\n";
      echo '<![endif]-->' . "\n";
  }
/**
 * load all template-specific stylesheets, named like "ie7*.css", alphabetically
 * for stylesheets targeted at specific versions of IE
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^ie[5-9]_/', '.css');
  while(list ($key, $value) = each($directory_array)) {
    $ver = substr ($value, 2, 1);
    echo '<!--[if IE ' . $ver . ']>' . "\n";
        echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />' . "\n";
        echo '<![endif]-->' . "\n";
  }