I work on a team of developers. Some like to use Dreamweaver but I really do prefer Notepad++. The problem comes whenever we need to edit one anothers files and the tabs don't match up / align (indentation). I'm curious to why this happens and wondering if there was a way in either Dreamweaver settings or Notepad++ settings to convert these tabs into something different so that they match. Is this possible / how?

Examples

The top image is simple CSS in Notepad++ and the bottom is code inside Dreamweaver.

Top: Notepad++ - Bottom: Dreamweaver

The image on the left is Notepad++ Tab Settings which is set to 4. The image on the right is Dreamweaver Code Formatting whose tab is also set to 4.

Left: Notepad++ - Right: Dreamweaver

The image on the left is Dreamweaver and the image on the right is Notepad++ which look to be using the same font Courier New 10px, though they do not look it.

Left: Dreamweaver - Right: Notepad++

Discrepancies

In the example above, in Dreamweaver it seems butting the bracket directly up to the h6 then tab does a double-space instead of a full 4 spaces where Notepad++ does a "7 space" tab which is very strange.


I believe that the problem is with the default styling of Notepad++ for CSS files.

Go to the menu entry of Settings / Style Configurator, then click on CSS and TAG, getting this :

image1

You will notice that the font used is @Batang (which I personally never heard of or used). This font does not look like it is a monospace font.

Change the font to the default and click Save & Close :

image2

Here is the display, where the first image is before and the second after this change :

image3
image4

The second image, from after the change, looks now much more like a monospace font.

You could change the fonts some more, to better agree with Dreamweaver. However, as I do not use it, I do not know what fonts it uses for displaying CSS.


If you take a close look at the image, you'll notice that Notepad++ is not rendering the monospaced font correctly. It appears to be an issue with the space character. See how the h4 tags don't line up. Compare that to the Dreamweaver screenshot where all the characters are lined up in neat columns.

This StackOverflow question seems to be addressing the same problem, so there may be something in the CSS template file that's causing problems.