css border collapse on span?

Question

I am doing a search and replace in php on a string.

If my example string is

My name is Matthew Scott Hailwood

Then when the function is run with the search of o the output becomes (split over multiple lines for readability)

My name is 
Matthew 
Sc<span class="highlight">o</span>tt 
Hailw<span class="highlight">o</span><span class="highlight">o</span>d

That part works perfectly.

My css class then has

.highlight{
    font-weight: bold;
    background-color: yellow;
    border: 1px dotted #a9a9a9;
}

Which also works perfectly.

But in the case of double letters eg the oo in the last name the middle border is twice as thick.

What I am looking to do is either a: remove the middle border all together if there are two, or the more likely one is to make the two borders collapse into one.

my php function is

function highlight($haystack, $needle, 
                   $wrap_before = '<span class="text_highlight">', 
                   $wrap_after = "</span>"){
    if($needle == '')
        return $haystack;
    $needle = preg_quote($needle);
    return preg_replace("/({$needle})/i", $wrap_before."$1".$wrap_after, $haystack);
}

Answer 1

If you use the regex /({$needle}+)/i regex will match groups of o's together along with single o's. So your modified code would look like:

function highlight($haystack, $needle, 
                   $wrap_before = '<span class="text_highlight">', 
                   $wrap_after = "</span>"){
    if($needle == '')
        return $haystack;
    $needle = preg_quote($needle);
    return preg_replace("/({$needle}+)/i", $wrap_before."$1".$wrap_after, $haystack);
}

The + matches one or more of the previous character (or characters from a group).