-
Posts
-
I just opened my website in IE8 and there are a TON of things that are broken. The menu overlays the logo, the text is stretched, the blog preview images are stretched on my homepage, and all of the buttons are transparent with no blue background. I tried the fix listed in this topic: https://kriesi.at/support/topic/buttons-in-ie8, but nothing changed. This is a bit urgent as we’re doing a soft launch of the website tomorrow. Advice?
Here’s a link: http://goo.gl/jGUCw
Thanks!
Sorry I don’t have IE 8 to look at it. But Iooked at it in FF, Chrome,IE 9 and Safari and it looks great in all of them. Maybe it is not backward compatible. Hopefully one of the support guys will have an answer for you.
Hi I have the menu overlaying logo problem in IE8 as well. I tried reducing the amount of items in the menu but this didn’t help.
Hi,
1.) To fix the buttons, use this on your custom.css or quick css, change the color value
.avia-button {
background: red !important;
}2.) The menu padding and font size can be decrease on ie8.
.msie8 .main_menu ul:first-child > li > a {
font-size: 11px;
padding: 0 10px 0 10px;
}3.) For the stretched image, try this:
.avia-content-slider .slide-image img {
width: 100%;
max-width: 100%;
}Remove browser cache the reload the page.
Regards,
Ismael
Hey Ismael, thanks for the response.
I implemented the code you suggested, which did fix the blog previews and the buttons, although the menu issue did not change. Suggestions?
Also, I discovered a few more issues:
– The header logo is stretched vertically
– The ‘You Might Also Like’ images on blog posts are stretched vertically
– The ‘Special Heading’ font is a bit too big/wide and makes several titles stretch into the sidebar, is there a way to reduce the size of these on IE 8 only?
– Most of the icons from the included icon font do not work and appear as 2 tiny rectangles
– My sidebar forms all seem to stretch off the page
– Images in the ‘Recent Posts’ widget only take up a portion of the image holder box
– Links in the footer are randomly underlined and not underlined
– Images on the ‘Meet the Team’ page go white/disappear on hover
EDIT: Also, it seems that the buttons no longer have hover effects, in IE8 or Firefox/Chrome/Safari/etc. Is there a way to get those working again?
Hopefully all of these items are fixable, as a majority of my company uses IE8.
Thanks for your support,
Tom
Hi,
Button hover:
.avia-button:hover {
background: blue !important;
}Image stretched vertically
img {
max-height: 100%;
}Links
a {
text-decoration: none !important;
}Image hover:
img:hover {
display: block !important;
}Regards,
Ismael
I think your logo image is definitely too big (should be 200px x 100px).
The overlaping problem also accours in Firefox if you decrease the window size
Please make sure that the “compatibility view” mode is turned off. Another user reported similar issues and it turned out that he/she used the compatibility mode which can break the website easily (because the browser tries to “emulate” another browser engine – https://kriesi.at/support/topic/the-solution-for-problems-with-ie-compatibily-view-just-the-opposite ).
Hey guys,
I’m not running compatibility mode in IE8, it’s simply how it is by default.
I went ahead with all of the custom css you recommended, Ismael (thanks for the help!). Some of it worked and some did not. Here are the remaining issues:
– Menu overlays logo
– Applying the img { max-height: 100% } broke my layer slider (images didn’t fit together anymore, things were off-center), so I didn’t use that
– The ‘You Might Also Like’ images on blog posts are stretched vertically
– The ‘Special Heading’ font is a bit too big/wide and makes several titles stretch into the sidebar, is there a way to reduce the size of these on IE 8 only?
– Most of the icons from the included icon font do not work and appear as 2 tiny rectangles
– My sidebar forms all seem to stretch off the page
– Images in the ‘Recent Posts’ widget only take up a portion of the image holder box
– Images on the ‘Meet the Team’ page go white/disappear on hover
– While there is now a hover effect on the buttons, I would prefer to use the gradients which were previously on the buttons. Is that possible? Or at least make it that way for non-IE8 browsers?
Thanks,
Tom
Hi Tom,
Try re-downloading the theme files from your downloads on ThemeForest and then installing those newest files. There have been a number of bug fixes released recently and that way we are working on the same version.
Regards,
Devin
Devin – I am having many of the same problems as Tom.
My layer slider also does not work on IE 8 but works fine in Chrome, FF, etc.
Given I made a lot of theme updates and things, how do I download the updated theme files and install them if I don’t want to lose all the changes I’ve made?
It would take awhile to record all of the changes I made in the CSS and other files.
Unfortunately when you edit the theme files directly you lose out on any kind of easy route for updating. CSS changes, as long as they were made to the custom.css file or Quick CSS field can be easily saved and re-added if they get written over but modifications to the theme files will need to be re-added.
You can also use the version.txt file that comes in the overall theme download (the one that comes with the docs, license and psd files) and attempt to only update those files that are mentioned as being updated.
Regards,
Devin
- The topic ‘Website Extremely Broken in IE8’ is closed to new replies.