Sellection in contentEditable collaps as soon as I click a button

As can be seen bellow, instead of <button> or <input> I have used <div> to create my UI buttons. Now the problem is as soon as I click any of the buttons, the selection in the edit area (a contenEditable <div>) collaps.

Interesetingly if I use <button> instead of <div> to create my UI buttons, everything works like a charm. I have seen this question asked many times before on stackoverflow, but they all use <button>. Any idea?

enter image description here