Can you guys point out what I am doing wrong on with the navigation on this site? It works fine on webkit, but not firefox!
http://datatables.dyndns-web.com/
vs intended
The NAV-tag isn't a block-element by default in current versions of Presto, Trident and Gecko. Only WebKit has a default stylesheet for HTML5-elements included already. You should use a basic-/reset-CSS to format all HTML5-elements.
See: http://html5doctor.com/html-5-reset-stylesheet/
BTW, if someones asking for an image, you should upload an image of the desired result, not one of the broken view…
Related
I have a problem with content from CSS on IE11.
.icon-ok:before{content:"\f113"}
IE11 is computing this to .icon-ok::before{content: normal}
I can see that there is .icon-ok::before{content: "\f113"} but it is crossed.
So I didn't get the right icons there. - Ofc it is working on all other browsers.
I thought that's because of the ::before pseudo-class, but it is computed by IE, in the source css file it is written as :before.
Can somebody tell me whats wrong there?
Edit:
I figured out that the IE is changing the icon-font id's.
When I use "\f118" in IE it is working properly there.
How can it be?
This can happen because different browsers needs different formats of the font.
So this isn't basically a CSS problem rather a problem which format of the font is used.
I tried with everything like proper style tags and all. but still site is not working in Firefox and IE
Link: http://webkurn.com/chrysler/index.html
Thanks a lot in advance
As per your CSS Statements they apply only on webkit-based browsers (Chrome, Safari, etc.). If you are pointing to a specific browser then you have to use webkit. Here you are making your queries to run on specific browser chrome or safari.
Try removing the webkit -webkit-min-device-pixel and check. Hope this help you
Most of the time, the problem is with the cache only if all the stylesheet tags are perfectly written. First try to remove your cache from your browsers of your website.Also, there are great tools like firebug(firefox) and inspect element tools(almost all browsers) which can be used to check the stylesheet file if it is updated or not.
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!
It's bizarre.
This site works perfectly in all browsers but IE7. In ie7 NOTHING works. Most of the css just doesn't even render. IE8? Fine. Ie9 Perfect. Firefox and Chrome, of course.
Want to hear something weirder? this is a template site i have worked with before. Other sites built on essentially the same template DO work in ie7.
This is why i think whatever it is is simple.
I don't want to paste the code here - it's massive. But i'll give you a link to the site and to the css
site: http://canadianrecovery.ca
css http://canadianrecovery.ca/css/screen.css
Thing is, i have document standard set to ie9 It works fine in ie7 mode with doc standards set to ie9
But i have noticed that most IE browsers don't display default doc standards... this is obviously some sort of issue with IE itself. But it's frustrating.. most end users have no clue how to fix this.
Thanks in advance.
ella
I think I may have found the reason. In your body-style (line 13), you have the following:
font-family: "Times New Roman;
See that unclosed quote? Seems like Chrome, FF, IE9 etc can fix that error, whereas earlier versions of IE read the rest of the CSS as your font-family declaration.
Try Modernizr, it makes a lot of things possible in older/less compatible browsers without a lot of trouble. Try the development version to see if it can help you and compose your own production version targeting your specific needs to minimize the size (and speed) of the javascript library.
Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser.
Thanks everyone. I actually found a solution. Look for a js script called ie7.js and include it with conditional comments.. it solves a LOT of ie7 issues
I'm having an issue with a WordPress theme project I'm working on (the theme is based on the Roots Theme for WordPress).
I'm having trouble controlling the font color of the main navigation sub-menus: but only in IE8. The font appears to be the same color as the background for the submenu, making it invisible to the user. Oddly, this issue only happens in IE8, and doesn't happen in chrome, firefox, IE7 or IE9.
The site is http://precisionmfgmn.com, to see the error try hovering over the "companies" link on the main navigation.
Here are some details that may be relevant:
I am using cufon font replacement.
Any ideas?
It looks like cufon is using canvas with IE8 and not IE7. IE8 doesn't seem to support it but IE9 does. Here is 2 possible solutions :
- modify the source code of the module, if the browser is IE8 then it should not use canvas
- force the IE7 compatibility view, you can do that by adding
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
in your template file
The first solution is probably the best but the second is easier.
hmm very odd, Cufon is usually pretty universal with the way it displays, I have used it before and not had a problem. Do you have any style sheets on Wordpress that are browser specific ?, I know they have them on Joomla, but not sure if they have them on Wordpress or not. If there is, one of those may be applying a slightly different style to IE8 that is breaking Cufon somehow, if there is a IE specific stylesheet try renaming it to temp remove it, to see if it makes any difference.
I have just taken a look at it with IE9 in IE8 compatibility mode and cant see a problem with it ?, have you tried clearing your browser cache and reloading the page ?, it might have cached previous changes you have made, so the text is showing an old version.