Indenting html + javascript/css Have you encountered an OS X text editor capable of indenting both the line

var x = 2;


and the lines

&lt;it&gt;Item A&lt;/it&gt;
&lt;it&gt;Item B&lt;/it&gt;


in the following html?

&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"&gt;
&lt;title&gt;Test&lt;/title&gt;
&lt;script&gt;
function foo_bar() {
var x = 2;
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="foo_bar()"&gt;

&lt;h1&gt;Header&lt;/h1&gt;

&lt;ul&gt;
&lt;it&gt;Item A&lt;/it&gt;
&lt;it&gt;Item B&lt;/it&gt;
&lt;/ul&gt;

&lt;/body&gt;
&lt;/html&gt;


I have tried all emacs packages purporting to do this simple task properly (through a major and a minor mode), but none is adequate. I am too heavily into emacs to abandon it altogether, but I am now looking for an editor other than emacs for this task.
I've written web-mode.el (available on http://web-mode.org) because I had the same problems as you. This Emacs Major Mode for editing HTML templates (HTML with CSS/JS/PHP/JSP) is autonomous (no other major required) and syntax-highlights and indents according to the block's type.

OP Raving

With nothing more than

(require 'web-mode)


in your .emacs and storing web-mode.el in an accessible location (your home directory will do for a start), the code sample in the question will look like this out-of-the-box.



To get the right indentation



you'll need to use

;; First the (general) requisite initialization.
(package-initialize)

(require 'web-mode)

(eval-after-load "web-mode"
  '(progn 
     (add-to-list 'auto-mode-alist '("\\.css\\'" . web-mode))
     (add-to-list 'auto-mode-alist '("\\.html\\'" . web-mode))
     (add-to-list 'auto-mode-alist '("\\.js\\'" . web-mode))

     (setq web-mode-script-padding 2)
     (setq web-mode-style-padding 2)
     (setq web-mode-block-padding 2)
     ))