Bootstrap and IE7 - css

Would I be correct in concluding that Bootstrap does not support IE7?
Are there any CSS or JS tricks to get around it?
I have tried a few different experiments using both emulation and an actual IE7 browser with the following results.
Default Visual Studio MVC template (3.0.0), note the form labels and login button.
Bootstrap Website (3.3.4), note the large navbar
Default Visual Studio Template Upgraded to 3.3.4, now we have the large navar and the badly formatted form.

Yes you are correct, i would either go with bootstrap 2 http://getbootstrap.com/2.3.2/ it isn't supported any more but you should be fine or try a poly fill like https://github.com/coliff/bootstrap-ie7 but bear in mind the latter is in beta and might be a little buggy

Related

How to make the ASP web pages designed in IE6 compatible to IE8?

My web applications are designed in IE6 compatibility mode. Now I need to migrate to IE8, but most of my web pages are not in good allignment in IE8 browser. First I tried the compatibility view in IE8(the button near the address bar), but of no use. Then as per somebodies suggestion I have added the meta tag '' in the section of every html pages, but still it is not working. I am using Windows XP professional OS version 2002 with service pack3 and IIS version 5.1. I am not sure I can migrate to IE8 with this system configuration. Moreover I am a beginner in this session. Could somebody please explain how can I acheive this?
Thanks in advance,
Lakshmi.
A good place to start would be to open up the pages in a tool like visual studio and look at the list of violations listed. Go down the list and start fixing things that are deprecated or wrong. Notepad++ has an "HTML Tidy" feature that will reformat and correct some common mistakes. However, many of the problems that you are going to encounter are not trivial - as in the entire paradigm followed is probably wrong. Converting a site is, unfortunately not the type of thing that we can do by running the pages through a wizard. I would start by creating a new MasterPage (or global template for whatever framework) that uses CSS for formatting and layout. Then you can migrate blocks of text into the new "skeleton". Some of the CSS template sites offer really nice free templates. Hope this helps.
If this helps you, the new IE 9 has developer tools (F12) which allow you to use either the IE7, IE8 or IE9 rendering engines to view any page.
As a best practise, when making any content for the web you should be checking compatibility on at least the 3 main browsers (IE, Chrome, Firefox), and probably some of the others (Safari). There are Visual Studio add-ins that can help with this kind of thing, by choosing which browser(s) are used for debug mode.
Some of the developer tool suites also allow you to edit content in the browser which can be a big time saver. This lets you tweak CSS and HTML and see the results in real-time, you then just have to apply your changes to the original code. Chrome, FireFox and IE (newer versions) all have tools for this kind of thing, and/or free plug-ins.
You will find in IE8 that the behaviour is better than IE7 and IE6 but still far from perfect, but should notice that the behaviour across Firefox, Chrome, Safari etc is fairly consistent.

Best way for cross browser applications

In our organization, we are still on .net 1.1 environment, using javascript, a few open source applications/widgets. Development is done using Visual Studio 2003, grid view, and iframes. Our application works in Internet Explorer 7 and IE 8 (in compatibilily mode). Can anyone give any basic steps we can take to get our application to work cross browsers? What are the starting locations we can get at to start making existing code work in different browsers?
Use jQuery for reliable cross browser JavaScript
Was it VS 2k or VS 2k3 that "helped" the developer by rewriting their HTML (in all CAPS no less)?
Make your HTML markup standards compliant. I find that developing my website following W3C standards ensure that my sites work in all major browsers.
I also develop in Firefox and then fix IE using conditional stylesheets.
The .NET version does not matter on browser compatibility.
Install and Run Firefox (and get the Firebug addon).
Enter your application and open the Firebug console (F12) to see what issues your application is encountering. (in the Console Tab)
Start with the Errors.
Change any JavaScript that is doing things like document.all.xxxx to use document.getElementById() or document.forms['name'].elements['name'] etc.
Change any CSS that is using IE only styles. e.g. "cursor:hand" should be "cursor:pointer" etc.
Repeat for Warnings once all the Errors are gone
If your app was running in Quirks mode, consider adding a doctype so that you can render in Standards mode (makes CSS/JS much more compliant)... however note that this will very likely "screw up" your pages for a bit until you iron out the kinks.
In the future, be sure to test in all major browsers. I'd recommend developing in Firefox or Chrome first, then tweaking if needed for IE.
.Net in its 2.0 iteration got a lot better (compared to 1.1) at producing cross-browser, and certainly more standards-compliant code (although not perfect by any means).
If you can upgrade to 2.0 this will get you a lot of progress on the standards compliance front for free (unless your own controls / html render as non-cross-browser html and/or javascript; then that would be the first main problem to tackle).
In .Net 2.0 don't forget to appropriately set the xhtmlconformance attribute in your web.config (if you're for example aiming for xhtml). This globally affects the produced html your controls produce.

What value has Visual Studios CSS support?

So I'm supposed to be a .Net Developer but have found myself getting stuck with allot of css and html stuff lately. I would now consider myself to be very strong in css and all it's intricacies. With that said I still see any use it any of the Visual Studio support for it outside of the intellisense (when it works).
I want to ask if anyone developers that view themselves strong in css are using any of the Visual Studio 2008 css support features and if so what they are and why they use them over say firebug?
Thanks,
Denis
Hand coded all the way for me.
Firebug is really good for getting to the bottom of wierd browser issues, but generally I have IE, Chrome and Firefox open when I'm coding html & CSS, and I just make sure I hit the refresh button often enough in all three of them to make sure I don't get any nasty suprises after writing a pile of css.
Typically I turn off all of the Visual Studio CSS stuff. It's not exactly well made. Instead I've been using MS Expression to build master pages and manage CSS files. It is light years ahead of VS.
That said, I see firebug as a complimentary product, not really a replacement. I use FireBug and the equivalents in safari, chrome, and IE 8 to see what's going on with the internals of a particular element on a page. I use Expression to edit and maintain the css.

Asp.Net website looking fine in IE6 but not in IE7/IE8

I have a small website developed using VS2005 and mySQl, it's just 2 webforms and login page.
During the development and testing phase, me and my customer were using IE6, and it was looking fine, we didn't test with other browsers because it's a small application, and just a add-in for large desktop application.
The customer informed me that site doesn't like the same when he installed IE7, for example I have a webfrom that show a page with Gridview that has multiply pages(AllowPaging=On), it doesn't look fine in IE7 and I can't navigate to other pages in Gridview, but it was working fine with IE6, and there's no complicated things, just plan GridView with small formatting.
I installed IE8 and doesn't look fine with it too, even in compatibility mood.
Have anyone faced the same problem?, and what should be the quickest or best solution for that?.
I know, I SHOULD NEVER USE WEBFORMS AGAIN.
The only reason for a difference in look between the browser versions is your styling and doctype.
Start with setting a doctype to run in quirks mode. You can get information about it here.
After that, see if things improve. If not, I would start ripping out any css/styles/themes you may be using. Then build it back up using normal CSS.
Incidentally, web forms isn't the problem in this case; it's a styling issue.
as Chris mentioned, add to that that browsers have really some annoying differences that makes you pull your hair sometimes, and 90 % of the time it is related to CSS.
so what i suggest is the following
use a tool called IE Tester, it is amazing tool that let you test your sites in all IE versions.
Use conditional command for targeting IE specific version if some CSS rule is wrong.
we use this tool http://rafael.adm.br/css_browser_selector/ it is really amazing it let you define css rules for each browser without hacking or conditional statement, but the down side it is Javascript dependent, but we had no complains.
also this script http://dean.edwards.name/IE7/ which is brilliant, it will let IE 6 behave like IE 7 which will save you tons of problems, again it is Java Script dependent.
Avoid Hacks as much as possible, the above methods will help you a lot.
hope this helps.

How to embed HTML created by Dreamweaver into an ASP.NET applicaton

I've been asked by a friend, who created a very visually appealing website mostly in Dreamweaver, to add some database backed functionality that I really only know how to do in ASP.NET. The problem is when I load his generated HTML into an ASPX page it renders it quite horribly. I've tried adding a basic .html page to an ASP.NET project but it still looks funky. He's on a Mac and i'm (obviously) using a Windows box. Is there a clean way to take a quite complete (but quite static) website and add ASP.NET functionality to it? Any comments are very much welcome. Thanks!
Just a quick thought.
You state in your comment:
Everything works is just doesn't look near as good as it did in the Safari browser
Where doesn't it look as good as it did in the Safari browser? When served as a page from a webserver (either the built-in cassini server, or IIS) in IE/Firefox, or when you switch to design view in Visual Studio?
Visual Studio has a lot of trouble rendering things correctly - it's really not standards compliant by anyone's definition - VS2010 is apparently much better - for example, try looking at this page: display/box/float/clear test in a browser and in the VS designer - very different.
If you mean in the browser, which browser? Have you tried looking at it Firefox instead? It's possible that if it's been built to look nice in Safari that it will work in Firefox, but there may be issues with the rendering/layouts in IE - this is a fairly well known issue.
If all the stylesheets are being correctly called (check with Firebug for Firefox for example) then there are probably some issues with the CSS that need to be addressed for IE.
ASP.NET does not alter the rendering of standard HTML. So there must be some other issue like a missing stylesheet (either all together or a broken link) or images. Once you have the HTML properly copied over and solve the display issue, you can add in the ASP.NET controls and code you need to make it functional.

Resources