messy css indentation in vim

Question

When editing an html file in vim, the indentation for css inside style tags is messy.

For instance, this is how it would indent this sample css code without any manual intervention to fix the indentation on my part:

    div.class
{
color: white;
       backgroung-color: black;
}

Why is this happening? how can I fix it?

Answer 1

I experience the same problem, can't really help but I tend to do is vi{ then 9<< and finally >>. I tried to find a good css indent, but none of the ones I tried seemed to work properly.

Answer 2

This indent script seems to work well (better).

Download it and stick it at ~/.vim/indent/css.vim

You'll need the filetype plugin indent on line in your .vimrc file, too, as kamaji suggests.

Now if I could only get it working on .css.less files...