Zero-Width Joiner, you just helped me to learn such a crap issue!
First off, this is not related to my blog title (Walk with Angel), however thought of posting it in public so that anyone can find a solution, if they come across such issues.
I use Notepad++ as editor (with character encoding as UTF-8 as default) for PHP development on Windows 7, along with this I also use GIT Bash and/or Cygwin for running linux commands on windows.
Recently, I’ve started learning Codeigniter framework.
All of a sudden, an unwanted space between the browser and HTML page started appearing. I’ve checked for the margin and padding for all the top elements, but no luck.
I’ve checked the view source, which appear normal in Chrome but <head> & <body> were displayed in red color on Firefox.
I’ve checked the source through inspect element and the header is not proper!! All the script between <head></head> are placed inside <body>, which is not acceptable.
Let me try the edit HTML
Damn, its showing some red spots (Actually the red spots were appearing inside/before <head>, screenshot taken post fix)
My Header file, it is proper! WTH is going wrong??
I’ve assumed that the issue could be because of the special characters getting added in the PHP file.
My searches were like,
1. html inside head goes under body
2. empty line before doctype codeigniter
3. How to find and remove the invisible characters in text file
4. Finding and replacing non-printing characters
5. find hidden characters notepad++
6. invisible character causing issues
7. find unicode character notepad++
During these searches, I’ve found this URL helpful to find out the character appearing.
http://www.fileformat.info/info/unicode/char/search.htm and I came to know it was “Unicode character U+FEFF: ZERO WIDTH NO-BREAK SPACE?”
Later my searches narrowed to just finding and removing ZERO WIDTH NO-BREAK SPACE, I wasn’t able to remove or find it/them out using Notepadd++ or even Vim editor (My Bad!)
1. find zero width space notepad++
2. find U+FEFF in notepadd++
3. find U+FEFF in notepadd++ in folder
I’ve even tried changing the character encoding to ANSI/UTF-8 without BOM
But there was no luck with results!
Then I had to go in Linux way to get it sorted out. This How do I remove  from the beginning of a file? question in Stackoverflow.com saved my life 😀
- Run the below given search in Terminal (Linux) or Cygwin or BASH
grep -rl $'\xEF\xBB\xBF' directory_path
It will list out all the files that contains our HERO CHARACTER 😀 - Open the file in VI
vi file_path
- Set the no BOB
:set nobomb
- Save and quit the file
:wq
- Continue the steps 2 – 5 and change all the files character encoding
This worked like a charm!! I’m getting fallen in love with Linux 😉 :*
Pals, what is the precaution should be taking to prevent such issues in future?
Also correct me, if I’m wrong 🙂
Leave a Reply