Jump to content

Firefox and Chrome display correctly IE does NOT


Recommended Posts

I have finalized my website, but there is an issue. Firefox and Google Chrome present the CSS correctly, but Internet Explorer does not. Can anyone help?

 

URL: http://www.abnarmysurplus.com

 

 

Hello,

 

Admin panel -  Advanced Parameters -> Performance 

 

CCC (Combine, Compress and Cache):

 

Enable - Smart cache for CSS and Smart cache for JavaScript

Link to comment
Share on other sites

The browsers are displaying different colors in the top and bottom footer. The Internet Exploder is #666633 and only the text Newsletter box and the button to subscribe are #3334D66 or a dark blue. On Chrome and Firefox the bar on the top is completely blue, the one on Internet Exploder is not displaying correctly. Is that explanation enough?

 

IE 11
Chrome 39.0.217.95
Firefox 34.4.5

Link to comment
Share on other sites

The top menu looks identical for me in Firefox, Chrome and IE.  So no, it is not enough information for me.  Also, if you are going to be rude, you will stop receiving help from me.

 

For the bottom footer, the background color is not blue, because the background URL is missing when using IE.  Would appear to be a theme styling problem

 

In Chrome, the following background URL is what causes the blue background to appear.

background: url(http://www.abnarmysurplus.com/themes/default-bootstrap/css/../img/footer-bg.png) repeat-x #666633;

When using IE, that background is missing.

 

Also you have CCC enabled in your back office, which makes it very difficult to help you locate which files need to be updated.  So disable your CCC options for the time being and let me know

 

Also, you should be requesting support from the theme author, especially if you purchased this theme.

Link to comment
Share on other sites

your global.css file needs to be revised

/themes/default-bootstrap/css/global.css

 

As I stated earlier, you are missing the background URL in the .footer-container class

background: url(http://www.abnarmysurplus.com/themes/default-bootstrap/css/../img/footer-bg.png) repeat-x #666633;

 

you have it defined as follows

.footer-container {
    background-color: #666633;
}
@media (min-width: 768px) {
    .footer-container {
    background: url(../img/footer-bg.png) repeat-x #666633; }
}

The background URL is defined within a '@media (min-width: 768px) { ', and I am guessing IE does not like that.

 

Why do you have it defined this way?

 

Link to comment
Share on other sites

SOLVED:

 

  .footer-container {
  background-color: #666633; }
background: url(../img/footer-bg.png) repeat-x #666633; }
  @media (min-width: 768px) {
    .footer-container {
    background: url(../img/footer-bg.png) repeat-x #666633;}

 

The image has to be both places for Internet Explorer, Firefox and Chrome to see the proper lower and upper footer colors.

Link to comment
Share on other sites

×
×
  • Create New...