I have these squiggly lines under CSS code that isn't cross browser compatible. It's really bugging me. Anyone know how to turn it off?
Thanks in advance for anyone sharing ideas on how to remove!
Internet Explorer for Windows versions up to and including 6 do not support transparent borders.
Source: http://reference.sitepoint.com/css/border-color
Assuming you're not developing for IE6, you should can choose to ignore this issue from the compatibility check and carry on.
Related
I just completed successfully transforming my site to CSS Grid. It works fine in Chrome and Firefox but scrambles things a bit in Edge and IE. In Safari for Windows it is also not right, but I believe that is an old version of Safari. I don't have an Apple to try an up-to-date version. Chrome and Firefox seems to have the lions share of usage statistics, so I am probably OK, but I thought I would see if anyone
has other opinions before I publish the site. Thanks for any suggestions.
you can loook at the can I use it page.
For browser which not support CSS Grid u can try a Modernizr Script. Try to look in the docs here
When I use Chrome and Firefox with this website http://hyojung.vn/network and it's work perfectly, but I move to IE all of my products is showed in 1 column as some small divices. How can I fix this?
Thanks a lot.
You need to provide folks with more info.
What version of IE are we talking about.
From a quick look, you are using flexbox which is not fully supported below IE11.
Totally confused.
At work, I have an older Windows XP machine (I have no choice) and on it I have IE8.
My boss has a laptop with Windows 7 and IE8.
I have a working prototype website with an IELegacy CSS that does some tricks to the CSS to make some things work in my Windows XP IE8. These tricks are small, mostly spacing issues. (Yes, I know, I don't like still resorting to doing this, but sometimes you have no choice.)
However, all the things in the ielegacy.css plus some other spacing issues go all wrong and totally wonky on my boss' Windows 7 IE8 machine. (like data blowing out of its containing cell in a table! how is that even possible - its a table).
I have no idea how to fix this.
So I ask the collective... is it even possible that IE8 can be doing different things on different versions of Windows? or is something else going on here?
If so, any ideas on how to adjust for that?
Also, if so, just kill me now :)
Thanks
JD
PS - I have no comparison screen grabs.. I will try to get some.
Update - thanks all - Compatibility View was the culprit. I totally forgot about it. (I only use IE for testing). Everybody had excellent troubleshooting ideas, and I agree, I did not provide enough info. (FYI fonts are standard MS Arial because I need full UTF-8 and I don't need pixel perfect...). I appreciate it!
Now I just need to get Compatibility View and non-Compatibility View to match up - which shouldn't be too hard. I just needed to understand what was going on. Cheers!
Have you checked to see if one of the browsers are in compatibility mode while the other isn't?
If you used the internet explorer developer toolbar (I believe the shortcut is F12) you can also change the engine your IE is using to render the site, making it render differently.
After reading the rest of the comments/answers:
You fix it by:
Making your site work in IE7, because that's what Compatibility Mode is "simulating". Your site should ideally work in Internet Explorer 7, as it's still used by a smallish percentage of users.
Figuring out why your site is arbitrarily sometimes in IE7 mode. Your site should be in IE8 mode all the time in IE8.
It's rather complicated, see: http://hsivonen.iki.fi/doctype/#ie8modes
A simple fix would be to add this meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
This should (almost) always force the most up-to-date IE browser mode, and Chrome Frame if it's available.
All other things being equal, IE8 should render the same on XP and Windows 7. It's more likely that accessibility settings, caching, missing fonts, screen resolution, and/or plugins are causing the difference.
after readindg your answer of user681919:
Do you have something like this in your code?
<meta http-equiv="X-UA-Compatible" content="IE=7" />
This force to render a page in IE7
or it could be that your browser is in quirk mode (when you have errors in the HTML and it cannot render properly it switch to a "safe mode" rendering)
Here some more details:http://www.quirksmode.org/css/quirksmode.html
I can use FireFox and FireBug, in a pane, I can open a .css file, in real time, as I make edits, I can see those edits reflected in FireFox. This is a very handy and valuable feature.
Without starting a debate over browsers, I would love to be able to do the same thing in Safari. My far too small display on this laptop aside, real time development of css helps me move things along at a very nice pace.
While I am near certain any input manager for Safari would not officially be supported, I am OK with that. I have been playing around with the "Web Inspector", but as far as I can tell, this will not fit the bill for my needs.
Are you doing this on a Mac? You can give CSSEdit a try. It's not free, but has a built in webkit preview
Get the latest version of webkit, it has a much more powerful version of Web Inspector which you can use side by side with the latest Safari (two browsers open) to debug Safari.
Which version of Safari are you using? I'd recommend getting Safari 4 Public Beta, which has a brand new Web Inspector that allows you to edit the DOM real-time (I'm not sure whether you can actually edit a CSS file with it, however).
Steve
You could try installing FirebugLite.
Recently, I started maintaining a web application which unfortunately works only with IE 6. Most of the issues are related to CSS.
Is there any tool which can help me standardize the CSS classes to work with both IE 6 and IE 7? I understand I have to go through standards but I need something to start with quickly.
Firebug can help me to some extend in identifying the CSS classes related to the UI elements (if the page renders on firefox). But, I was looking for something more like an advisor tool. If you have some experience to share, please feel free.
Try out SuperPreview or the whole package (Expression Web announced at Mix)..
SuperPreview is a new free standalone application from Microsoft (still in beta) which enables you to see how your websites will look across different versions of Internet Explorer making migration from IE6 to 7 and 8 much easier than before, without have to start up a Virtual Machine to run IE6, or have a separate computer dedicated to running IE6.
Check out Dean Edwards' IE7
Tredosoft's Multiple IEs is a good compare/contrast. You go ahead and upgrade to IE7, then install this (selecting just the IE6 option, unless you need all of 5.5/5.0/4.0/etc.), and you can see the pages simultaneously in both browsers. This will help you figure out what has to be conditionalized/hacked.
Also, the IE Developer Toolbar, although not as good as Firebug et. al., will at least let you see in IE what the browser thinks is happening with your styling.
Sometimes you need to introduce a little hack for IE6 and IE7 like removing double margin and I use the following pure CSS code
css-selector { code for all browsers }
*html css-selector {code for IE6 browser }
*+html css-selector {code for IE7 browser }
it is not a tool that you expecting, but may be it would helpfull