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...

Answer 3

Try using this html filetype indent script instead. It has improved support for style tags. Javascript and CSS indent handling in HTML pages is known to be problematic with the html indentation in Vim. I ve yet to find a script that does everything perfectly.

Answer 4

I was having a similar problem.

My solution was to edit (after backing up) the global vimrc file and uncomment the following lines, by removing the double quotes at the start of each line:

"if has("autocmd")
"  filetype plugin indent on
"endif

I also had set cindent in my local ~/.vimrc file so I removed that.

Seems to be working fine.

Answer 5

One explanation might be that you have a mixture of TABs and spaces in the file.

(Although the appearance in the question may be more due to Markdown than anything else)

Answer 6

In my case the problem is because of cindent. Find the following line in your .vimrc (or .gvimrc, ...) and remove it.

set cindent

Then you are good to go. Lastly if you are both a web page developer and kernel developer you can perhaps use a mapping like bellow to toggle cindent on and off

map <F8> :set cindent!<CR>

友情链接