Asp.net web app issue with IE10 Compatibility mode [closed] - html

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I have an asp.net app with a dropdownlist control of larger width and vertically centered aligned text.
Yesterday my dropdownlist control suddently lost it's css width/alignment properties displaying incorrectly at the browser (IE 10).
After hours searching the problem, I noticed it was because I had accidentaly hit the "compatibility mode" button at the address bar (next to the url).
details on my post at: Vertically align text in a asp.net dropdown list control.
After hitting back the compatibility mode button it starts working well back again.
Since that happened to me, I wondered it could happen to end users to and so display it incorrectly to them as well.
Does anyone know how to avoid that and create a dropdownlist/web app that doesn't unformat if the user accidentally clicks that button?
By the way, I also used the IE dev tools to test my page on older browser versions and noticed that it works well on IE 9 and 8 as well, but the dropdownlist messes up on IE7.
Thanks!

Your best option is to add a conditional css reference which kicks in if the IE browser version is less than a given amount. For example if you add a new css file which contains styles specific to IE7. These commented out sections are IE hacks. This sytle sheet will not take effect unless the browser is IE7.
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="/styles/main.IE7.css"" />
<![endif]-->
Then you need to adjust your styles in this style sheet to suit IE7.
Also sometimes IE is set to display intranet sites in compatibility mode. See this for adding a setting in the web.config which will prevent this X-UA-Compatible is set to IE=edge, but it still doesn't stop Compatibility Mode

Related

Table bottom border is randomly getting displayed in Outlook desktop app [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 months ago.
Improve this question
In above image the table bottom border is missing. It appears randomly when scrolling or when open close the outlook app. This issue occurs only in outlook desktop app but it works fine in browser. Im working in react project, in that we are creating a table with data's and sending it to mail. While viewing in outlook this issue occurs. It works fine in yahoo, gmail domains.
Any solution for this issue?
It's most likely due to your web browser rendering engine displaying the HTML in your email where the outlook desktop app will use it's own rendering engine (basically a slightly modified version of the old Internet Explorer one).
Without seeing your code, it's difficult to see where the problem lies but you would probably need to use some HTML logic to differentiate between whether you're using a browser or Microsoft office.
In your HTML code you can use logic to display different code depending on if you're viewing it in a web broswer or desktop app.
e.g.
<!--[if mso]>
<style="some outlook desktop specific styling">
<![endif]-->
<!--[if !mso]>
<style="some web browser specific styling">
<!--<![endif]-->
If you could post some of your code, I could better explain where you need to make changes.

How to make a website Browser friendly? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I Know this is common question in web Development but what what should be things that i must take care while developing a HTML website? Why does my site look different on different browsers, till now i checked it on Chrome and Firefox. So dimensions on both were too different. Is there any specific code for CROSS BROWSER compatibility ?
I would develop for one browser and worry about cross browser compatibility later. Most of the differences are between WebKit browsers (chrome, Safari, opera), internet explorer browsers (8,9,10,11), and Firefox. I would recommend developing on one browser, and then checking your site in others afterwards. I doubt you will have too many things to fix. Mostly there will just be styles that may not work the same way on certain browsers. One thing to keep in mind is that your site will probably never be perfect in every browser. For the websites I design, I have a list of browsers I support. There are things that just won't work on ie6 and not enough people use it to make the effort worthwhile. A good rule is to worry about the latest version of each browser or the latest few versions. As you can see, there's no simple answer, just make sure to check your work.

Built a site in HTML5 and CSS3 and now can't be viewed on Internet Explorer [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I built a site for a small business and it looks great and they love it. Everything is fine up until we notice that older versions of Internet Explorer (8 and older) can't view the site. It looks completely messed up. I used Bootstrap which uses CSS3 and HTML5 elements.
What can I do about this? I don't want to remake the entire website.
You need to use an HTML shiv so older versions can tell what the new HTML5 tags are. For the use of CSS3, you need backup images or something for older versions to fall back on.
html5 shiv
How to use
More current info
HTML5 Shiv IS A MUST FOR OLDER BROWSERS! This is why your site looks crazy. Older browsers don't know what a nav or header tag is so it will not display any of those styles.
It depends... some CSS can be emulated quite nicely with css3pie, check www.css3pie.com.
But if it's not enough, you may have to convince your users to switch to Chrome, Firefox or Safari.

Layout OK in Firefox, Safari & Chrome but not IE [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
New to HTML/CSS but have had training; based on my trainer's designs built a site that looks OK in Firefox, Safari & Chrome but IE everything goes out of the window! Would appreciate help on either how to fix it, or where I could look to get more info on where I'm going wrong. Many thanks.
http://www.mandolinjack.com
The main reason you're having problems with IE is because your site makes IE go into Quirks Mode.
Quirks mode is a very old backward-compatibility mode that is built into IE. It causes the browser to render the page quite differently to normal, and it also switches off a lot of the newer features in the browser. You therefore want to avoid quirks mode at all costs.
The reason you're in quirks mode is because you haven't put a doctype declaration at the top of your page. If you don't specify the doctype, IE defaults to quirks mode.
If you're not sure what the above paragraph means, that's fine; just add the following line to the top of your code:
<!DOCTYPE html>
...right at the top, above the <html> tag. That should solve most of the problems.
You should also run your page through the official W3C Validator to check if you have any other errors in your HTML code, and fix anything that it finds.
Hope that helps.

Web page displays in Chrome, Firefox, Safari, Not I.E [closed]

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 10 years ago.
Improve this question
Perhaps someone can find the problem. I've tried everything I know. And I apologize if this has been addressed before. I found similar threads, but none that address this problem specifically.
If you visit hiredimensions.net using Chrome, Firefox even Safari it will display properly. However, not so in I.E. (any version). It appears that it will not resolve the CSS background elements for the middle and lower part of the page. This site has been checked in W3C and is 100% compliant; no errors.
If you have any suggestions at all or need to look at the CSS please let me know. I'm stuck on this one.
Thanks.
This works fine in IE9 for me, but I had to change the document mode to an IE9 version. I assume this will work in IE10 as well, but I can't confirm.
I think the problem is that you are using HTML5, but it doesn't look like you are doing anything to support older browsers. If you inspect the markup in IE8 or less, the section element with the content-bottom ID is empty; same with the article. If you inspect the same element in Chrome, for instance, this is not the case and you will see that the article (and div) are in the section element.
EDIT: Check out this link, http://bit.ly/11D3Dyg; it has some options that will probably help. Also like bažmegakapa said, trying using a different meta tag that will try to force the latest render mode.
It works in ie 10 for me. Hit f12 and go to the network tab. Reload the page you will see you have no /js/HTML5.js file.
I tried it in ie 7-9 as well and no issues.