Style text node

by Daniel Gasser

HTML

<div class="target">
    &nbsp;1&nbsp; 
    <a href="#">&nbsp;2&nbsp;</a>&nbsp;
    <a href="#">&nbsp;3&nbsp;</a>&nbsp;
    <a href="#">&nbsp;>>&nbsp;</a>&nbsp;
</div>
<br />
<div class="target">
    <a href="#">&nbsp;<< &nbsp;</a>&nbsp;
    <a href="#">&nbsp;1&nbsp;</a>&nbsp;
    <span class="xxx">&nbsp;2&nbsp;</span>
    <a href="#">&nbsp;3&nbsp;</a>&nbsp;
    <a href="#">&nbsp;>>&nbsp;</a>&nbsp;
</div>

CSS

.target{
    line-height:30px;
}
.xxx {
    background: red;
}
.target a {
    min-width:30px;
    height:30px;
    display:inline-block;
    background-color:yellow;
    text-align:center;
    padding:0px 3px;
    text-decoration:none;
}