Chrome, Firefox, IE browser plugin to reload CSS without reloading the page

When developing and adjusting the CSS, a methodology is using firebug to directly edit the styles and then re-apply the change on the real file with the editor.
In other cases, it’s more practical to change the CSS directly, but reloading the full page is a bit time consuming.

Here is a trick to reload only the CSS. There are browser extensions for it, but at the time of writing, none of existing ones works as expected, at least on chrome.
So, I simply solved by creating a browser tool-bar link that reloads the CSS without reloading the full page, with one-line of JavaScript.

From your browser toolbar: right click and select the option to add a new URL (“Add Page” on Chrome)
name: “Reload CSS”
url: the following script

Or just drag this into the toolbar Reload CSS

Chrome command line options for windowed HTML applications

An example of combination of chrome command line arguments to launch an HTML page…

  • windowed, that means in “app mode” (no toolbars, –app=”<url>” argument),
  • with no web security checks (= allowed DOM manipulation of frame loaded on a different domain, –-disable-web-security), that allows Javascript to modify the content of forms loaded in other frames from external URLs, for full-flegded interactions.
  • with a custom user-agent (–user-agent). I personally use it for a website that – with a mobile User-Agent – displays much less annoying banners and a layout that better fits its small frame;
  • with independent user session settings (–user-data-dir=”C:/path-to-temp-files”). That’s necessary to avoid chrome sharing settings with your current chrome user session, and mandatory to enable ad-hoc settings like the web security