I have recently built my own site www.poolspots.com. I am new to css and I have been developing in FF. When I checked it out in IE everything in the header and the footer is out of wack. I was wondering if anybody has any idea on how to fix this problem. If you look at it in FF it looks fine but when you look in IE it is way out of wack. I did manage to get the border off of the logo but it is still there for the Social Network Icons. Any help would be much appreciated.
P.S. I am not sure what version of IE I am using, I've looked everywhere but I can't find it.
add this to your CSS a img { border: 0 }
Related
In IE10, border is not getting displayed on page load, it displays only after I hover over that particular section. Its looking fine in IE9 and Firefox, the issue persists only in IE10.
Unfortunately I couldn't share code as its a restricted internal dev environment.
If anyone of you came across such scenario, please share the solution. Thanks in advance!
If you are familiar css then you might also know that the issue you have mentioned "displays only after I hover" will occur only when you have put something like the following in css
#a : hover
{
border:5px solid white;
}
If you haven't mentioned such thing in your Stylesheet or inside html tags then what #MarioErmando said would be the issue. Try using F12 Developer tools in IE to check.
I'm working with WP website now and stuck with one problem.
The website is working fine in Chrome, Firefox, Safari, Opera and IE10, but in older IE versions (like IE9) it looks very strange. It seems that my custom CSS doesn't loaded properly. The interesting thing is that CSS styles partly applied to the website (icon font) but not styles which overrrides Foundation framework styles.
Maybe someone can explain me what I'm doing wrong and put me into right direction?
P.S. I'm not sure that it's important, but I based my WP theme on Foundation WP theme.
Thank you in advance!
Alex
have you tried adding this to the top of the head tag above the title tag to make sure IE uses the highest version in IE
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
also when viewing in IE are you checking the in the inspector (F12) making sure the Document Mode matches the Browser Mode so if your checking IE9.. you would
Browser Mode: IE9
Document Mode: IE9 Standards
The class .dl-menu is using the code:
opacity: 0;
Which is not very cross browser. You need to use a few versions for better support of opacity.
This is only the one point, and it looks like there may be others to me, but see if changing this helps you.
This page will explain the cross browser opacity properties well: http://css-tricks.com/snippets/css/cross-browser-opacity/
The problem appeared because the main CSS file was too large for IE8 and lower, and it just croped my CSS styles. I've broke it into 2 files and this fixed the problem :)
Thank you everyone who tried to help, and especially Spudley for pointing into right direction!
I'm building a html website using foundation.zurb 4 framework and now I'm having an issue on making the nav bar work on IE8. I kind of manage to make everything work on IE8 except that nav bar. I'm using a separate css file for the nav bar menu and another one for the IE8 tweaks. All the files can be found here.
I'd like to apologise the fact that the code is quite long and hope my request is not a bit too much to ask. I hope someone could help me as I'm getting a bit desperate now :(
Update: See it in action here It doesn't need to be responsive on IE8 I just want it to be static ;)
Media Queries - Responsive CSS3 is not supported for ie8 or less.
You are using this:
#media only screen and (min-width: 58.75em)
.top-bar .toggle-topbar {
display: none;
}
IE8 is like..."WTFISTHIS?"
Meaning it tries doing it but it just doesn't understand going back and forth
There is this plugin:
https://github.com/scottjehl/Respond
If you really need to support it but my answer is to let ie8 be static like a regular desktop version.
I am trying to modify one WordPress theme http://demo.wpzoom.com/evertis/ and use it on my own site.
However, something weird occured, the footer area will not display properly with Firefox (while it works fine on IE8):
The original theme works fine on Firefox and IE8.
Whats the possible reason?
More Information: I am using Notepad++ with Encoding "UTF-8 without BOM." Many years ago, I saw a problem similar to this one with IE6, after I change the Encoding to "ANSI", everything is fine. But this time it wont work.
Thanks a lot!
Try overriding the margin-right on the last footer section, something like:
.wpzoom-flickr-photos { margin-right:0; }
I think the problem is with the display: inline-block which is known for having issues. Here is an article where you could find the answer you are looking for:
http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/
I have a menu that looks fine in FF but in chrome and IE it is not sitting right on the line. Can anyone help. I have tried many CSS hacks but they have not worked in wordpress. I even tried external IE sheet and somewhere it was getting over written.
site
site remove for other purposes.
chrome and IE it is wrong.
Have the same problem as yours
IE version 6-8 have so many problem unlike 9 its better.
if you are using list on menu use this
display:inline;