Backspace removed div's

Hello i have recently started developing on word press so that i can take on more clients, since a few have opted to go else where that offer wordpress sites however i have ran into a bit of trouble, i can set up my theme, header, footers etc, I take my HTML code that ive typed up from notepad, stick it in with the HTML editor and it will work fine, the problem is when I go to “visual” editor, click the start of a word where I know a div starts and press “backspace” it will merge that div with the one above it, i do not want this to happen as it breaks the layout of the page is there a way to prevent this, i dont want to disable the visual editor because i then i have to explain to every client what the HTML code is and why not to remove it etc. Any help on this issue is greatly appreciated.

P.S this happens with themes ive made, the default themes, other people’s themes etc.