Fixing phantom links in the blog body
<div style="text-align: right;">
<a href="http://www.rako.com/Contents/" target="_blank">Contents
The only thing I added was the nested <div>. Sure, I know I am supposed to give the <div> I created an id or a class and use the stylesheet to move my table of contents link to the far right, but I had not trashed the Movable Type css stylesheet just yet so I just wanted to do it locally in the html.
That innocent little <div> in the header caused every piece of text in the body of the post to have a link to the same place, the table of contents. I only figured out I had a header problem when I changed the link in the header and noticed that whatever I changed it to became the mystery phantom links that showed up everywhere in the body, assigned to text that otherwise had no links.
It took hours to narrow down the exact problem in the header and a few minutes to fix it. What I had to do was change the Banner Header code I inserted from the above to this:
<a style="float: right;" href="http://www.rako.com/Contents" target="_blank">Contents</a>
That seeming innocuous change made all the phantom links go away in the body of the post or index page, made the title text render right on Explorer 8, and took away all the underlines in the body of the text when rendered on an Android tablet.
This post is in these categories: