In edit mode, your Drupal text panels will show a WYSIWYG interface marked "Full HTML" as well as two other modes, "Filtered HTML" and "Plain text."
"Full HTML" doesn't really display how your content will look in a browser. "Plain text" is helpful for revealing your html tags but you must change the display back to "Full HTML" or Drupal will display your raw code. And "Filtered HTML" can obliterate your code so just avoid it at all costs.
When switching back and forth between these two modes, Drupal may mangle your html when you save your work. It may mix up your intended order of <a href> and <div> tags or add extraneous </br> or tags. Your code may seem correct when you save it but if it doesn't display correctly and you go back in to fix it, you discover it isn't what you saved.
To help make editing your html more stable, add a custom text view format as follows:
- Configuration > Text formats > Add a text format
- Name it “Non-formatted html”
- Under roles, check “Administrator” and “Content manager”
- Under Enabled filters, uncheck all except “Correct faulty or chopped-off html”
- Navigate to the block in which you are experiencing the problem: Structure > Blocks
- Click on “Configure” in the right column, and select “Text format: Non-formatted html.” This will allow you to write your custom html into the Drupal field and leave it as displayed.
- Check to see if this cleared up your problem. Refresh or clear your site cache if needed.
- You may edit and save your html in this mode and Drupal will display it correctly.