检查元素后出现奇怪的HTML问题

Question

I am having a weird issue with my HTML. It is almost like it is being escaped for some reason. The problem is on my tag, it is being rendered as:

<h3&nbsp;class="custom-image-text">Student Stories
                </h3&nbsp;class="custom-image-text">

I was trying out bracket editor (usually use sublime) but I don't think the editor was the problem. Also tried it on JSFiddle and get the same result (when you inspect the element). I will add my code in the snippet but if it doesn't do it there I will link to a JSFiddle, any idea what is happening? Also I will add I did 'cat' the file and the HTML was clean on the tag as I would expect

  <div class="custom-image-container"> <img class="front-page-flex-image" src="<?php echo get_template_directory_uri() . '/images/startup.jpg'; ?>" /> <div class="custom-image-overlay"> <h3 class="custom-image-text">Student Stories</h3> </div> </div> 

Answer 1

Problem is that your HTML code contains also PHP. You need to process that code by PHP, which will return HTML.