3

In several places I am using linked abbreviations for a set of words, and Google is picking these abbreviated terms as sitelinks. Problem is, the abbreviation only makes sense in context, not when viewing the Google site links.

Each link has a title with the full text. Is there a way to only show the first 3 letters but keeping the entire string in the HTML? Setting a short width doesn't work well.

2

CSS directives:

a.abbrev span { display:none; }

Links:

<a href="..." title="Full Text" class="abbrev">FT<span> (Full Text)</span></a>

Updates: ... a less ugly solution and why other avenues of exploration will probably not yield the desired results.

CSS directives:

a.abbrev span {
  display:block;
  float:left;
  width:1em;
  letter-spacing:2em;
  overflow:hidden;
}

Links:

<a href="..." title="Full Text" class="abbrev"><span>Full</span> <span>Text</span></a> 

Things that won't work:

Using F<span>ull</span> T<span>ext</span> with display:none: Google displays <span> tags in links as spaces - i.e. your links would appear at Google as "F ull T ext"

<acronym title="Full Text">FT</acronym> - Won't be expanded

<abbr title="Full Text">FT</abbr> - As with <acronym>, highly doubt this will be expanded for purposes of Site Links

CSS :not() selector: :first-letter is a pseudo class and the :not() selector does not accept pseudo classes

  • Some useful hints there - thanks, I'll give it a go. – DisgruntledGoat Dec 1 '10 at 11:09
1

You could use the abbreviation tag as follows:

<abbr title="Hypertext Markup Language">HTML</abbr>
  • 2
    Anyone care to share why this was voted down? Not particularly bothered, but it would be nice to learn from my mistakes – Piers Karsenbarg Dec 14 '10 at 11:07
-1

Try this

<a href="..." title="Full Text" class="abbrev">AB<span>Full Text</span></a> 

a.abbrev span {
   white-space: nowrap;
   width: 15px; /* adjust the with to show the approximate number of letters you want  */
   overflow: hidden;
   text-overflow: ellipsis;
}

I'm not sure it works cause I didn't have the time now to test it, let me know.

Ref. http://www.quirksmode.org/css/textoverflow.html

  • 1
    The "em" measurement specifies the width of the widest character in most fonts - a capital "M" - and is therefore the better way to display a single character width from CSS regardless of font-size. Note that only monospace fonts will reliably print only one character within 1em - which is why using letter-spacing to put the next character out of the display field is advisable in this case. – danlefree Dec 1 '10 at 13:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.