Move up character displayed inline

Question

I have the following markup for breadcrumbs menu:

<div>     <span class="start-here">You are here:<span>     <a href="/">example.com</a>     <span class="raquo"> › </span>      <a href="/news">News</a>     <span class="raquo"> › </span>      Title </div> 

Is there a smart way to move those › (.raquo) characters a few pixels up without absolute positioning when all of the elements are displayed inline? I want this character to be smaller than the others and to be displayed in the center of the line (or some pixels down/up).

(I need it to work also for IE6 and up)

Answer 1

.raquo {     position:relative;     top:-2px; } 

worked best for me