In the HTML, there was markup like this:
<a class="photo-zoom" href="Moscow_025.jpg"> <img src="Moscow_025.jpg" alt="" /> </a>
Nothing wrong there... but on CodePen that image
src is certainly going to 404. But they weren't. Digging in just a little, I discovered that Adem had set the
<base> tag in the "Stuff for
<head>" section in the HTML settings area.
specifies the base URL to use for all relative URLs contained within a document.
according to MDN.
When you use the Asset Hosting feature on CodePen, all your images get file paths like that. For instance:
So by setting the
href of the
<base> tag as Adem did, the relative URL's of those
srcs were automatically adjusted correctly. Clever clever.
Usually it's just a copy and paste job, so no big deal, but it certainly is a nice touch to clean up the HTML for readability sake.