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?


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


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.

  • What display font are you using in Dreameaver and in Notepad++? In your second image (notepad++?) it doesn't look like a fixed width font ...
    – DavidPostill
    Dec 2, 2014 at 22:19
  • a) Use the same font in both, and b) try turning off the "Indent with 2 spaces" option in Dreamweaver. Also, can you please make the TAB/whitespace characters visible in the editor(s) and re-do the screenshots (so we can see the actual whitespace characters being inserted)? Dec 2, 2014 at 22:27
  • @Ƭᴇcʜιᴇ007 I'm not sure how to make the TAB/Whitespace visible in either editor besides highlighting - is there an easier way to do this that would be more helpful? Dec 2, 2014 at 22:35
  • Notepad++: View->Show Symbol->Show White Space and TAB. Dreamweaver: View->Code View Options->Hidden Characters. :) Dec 2, 2014 at 22:40
  • @Ƭᴇcʜιᴇ007 That's cool, thanks! I've updated the first image to the image with the tab / space highlighting. Dec 2, 2014 at 22:54

2 Answers 2


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 :


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 :


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


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.

  • Yeah that was the problem. My globals were Courier New but for whatever reason CSS was different. Now I know I need to check the fonts on a language level to match up with Dreamweaver. Thanks a ton! Dec 29, 2014 at 14:35

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.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .