Viewing CSS comments in Internet Explorer's F12 Developer Tools - css

I never noticed this before, but IE's dev tools completely strip out CSS comments in the CSS tab. I'm working with a large front-end framework and need to wade through the dev version of the CSS -- mainly to cross-reference the documentation/comments. Am I missing a setting/flag/whatever, or am I out of luck?

Whilst not ideal I would have to suggest using firebug lite.
https://getfirebug.com/firebuglite
It will at least give you half decent tools to view these kind of things.

Related

Is there a way to track changes to the DOM and CSS Inspector in developer tools?

When you make changes to the DOM or CSS when using the developer tools of a browser, is there a way to view all the changes you have made in one place?
I can't see a way to do this in Safari or Firefox Developer Edition. If possible, would it require an external plug-in?
As far as I am aware you can do this in Chrome for local files.
The Chrome DevTools Setup Guide explains how to do this.

Should I trust Chrome's Audits tool?

Do you know Audits tab from chrome's inspector? I just found out this tab's use and I think it is great but I wonder if the sugestions done there are reliable.
FOr example it says I shouln't use -webkit-border-radius, which seems right as it as a really old rule. Problem is... are this suggestions focused on a general good use of web developing for most common used browsers or are they refering to chrome only and more specifically to the current version of chrome?
If they're suggesting not too use a vendor specific prefix then that's because that rule has been pretty much accepted by everyone. The Google Chrome team have a lot to do with standards, as does Mozilla, Apple, Microsoft and Opera (along with many others).
A lot of the things are very generic performance guidelines to reduce page load time and you should be fine following them.

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.

How to edit css live with ie6

Hallo all.
I need a tool similar to firebug with ie6 to edit css live.
I tried to use ie developer toolbar but in ie6 seems not to let you edit the DOM as wanted.
Is there any tool around?
Kind regards
Massimo Ugues
There's one but it's pretty buggy.
It's called cssVista.
I am using version 0.1.5.3.
I've not checked to see if you can change or edit CSS live in it, but I've used Firebug Lite in Internet Explorer in the past. You might want to check it out.
I've heard great things about Adobe Dreamweaver CS 5, it has this feature. I also here that where other software has failed (things like Drupal with a bazillion nested CSS files), Dreamweaver CS 5 handles well.

Did you find any better feature in IE 8 Developer than firebug?

Does IE 8 Developer toolbar have something better than firebug ? How to use IE 8 Developer toolbar in a way like we use firebug in firefox.? Is there any good tutorial on "how to take good use of IE 8 Developer toolbar"?
If you're looking for something that mimics firebug in IE (your question is unclear), then there is Firebug Lite. If you're looking for a resource for learning about the IE8 Developer Toolbar there is this article and a number of other articles available via simple searches.
edit: got a more up-to-date link for the Dev Toolbar article
While the IE Developer's ToolBar, which was an addon for IE<8 and has been integrated into IE>8, is tightly integrated into IE and has it's own unique benefits for debugging IE specific issues, I find Firebug to be more conducive to general debugging scenarios.
That is my take on the first of your THREE questions ;-)
I will leave the rest to others.

Resources