[TYPO3-english] Hiding link text

[Mike Crabtree]

Hello,

I have a problem with link text being displayed over the top of the image 
which is meant to be replacing it.

Our html template uses an image for some of the page links, with a <span> 
tag which hides the link text.

The HTML code:

<div class="template5_panel">
<p class="nospace"><strong class="colour">TEACHING</strong></p>
<div class="template5_panel_readmore"><a href="#" title="Read 
More"><span>Read More</span></a></div>
</div>

The associated css entries:

.template5_panel_readmore a { width:235px; height:31px; 
background:url("template5_panel_readmore.gif") left top no-repeat; 
overflow:hidden; display:block; margin-top:3px; }
.template5_panel span { display:none; }

I have used TemplaVoila and have mapped an element, editing type: Link field 
to the <div class="template5_panel_readmore">, which inserts the image 
button when you add a link using the RTE Links box.  However, the name of 
the pagetitle of the linked page is displayed over the top of the image 
button as the <span> tag is excluded from the final page code.

Code from displayed page:

<div class="template5_panel">
<p class="nospace"><strong class="colour">TEACHING</strong></p>
<div class="template5_panel_readmore"><a href="index.php?id=50" title="Read 
More" >Teaching</a></div>
</div>

Is there a way to stop the pagetitle text appearing on top of the image 
button ?

Thanks,

Mike