hasen
hasen

Reputation: 166152

messy css indentation in vim

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?

Upvotes: 8

Views: 4823

Answers (6)

pazel1374
pazel1374

Reputation: 228

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>

Upvotes: 0

artfulrobot
artfulrobot

Reputation: 21397

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

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

Upvotes: 1

lukaszkorecki
lukaszkorecki

Reputation: 1773

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.

Upvotes: 4

Pierre-Antoine LaFayette
Pierre-Antoine LaFayette

Reputation: 24402

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.

Upvotes: 1

pavium
pavium

Reputation: 15118

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)

Upvotes: 0

Related Questions