: Is this inline-block trick involving 'font-size: 0' dangerous for SEO? A while back, I answered this question on Stack Overflow: https://stackoverflow.com/questions/5078239/how-to-remove-the-space-between-inline-block-elements

@Odierno851

Posted in: #Css #Google #Html #Seo

A while back, I answered this question on Stack Overflow:
stackoverflow.com/questions/5078239/how-to-remove-the-space-between-inline-block-elements
The problem is that elements with display: inline-block have "extra gaps", due to being affected by whitespace in the HTML, see: jsfiddle.net/thirtydot/4z4v2/
As shown, the gaps can be removed by removing the whitespace in the HTML. However, removing that whitespace is sometimes an undesirable fix: for example, it makes the HTML more difficult to work with.

So, I suggested this workaround: jsfiddle.net/thirtydot/4z4v2/1/
ul {
font-size: 0;
letter-spacing: -1px;
}
li {
font-size: medium;
letter-spacing: normal;
}


(letter-spacing is required to fully eradicate the gap in Safari)

And that was that..

..until a comment popped up when this technique was suggested in another answer:


Be careful with this code because it might be interpreted by web
crawlers as abuse since you are explicitly hiding text inside an
element containing links. Its true that the links itself are visible
thanks to a higher specificity rule but still web crawlers see a bunch
of links inside a container which tells all of its ancestors to hide
their textual content.


I've used this technique on only one site (..I usually just remove the whitespace), and the site has ranked properly on Google (no link, sorry). If it matters, the site has pages targeted very specifically in the format of "Phrase + Location": as a fictitious example "Zombie Chopper Ravenholm".

I only really care about Google, but answers concerning other search engines are also welcome.

So, my question is:

Is the mere presence of font-size: 0 a risk for SEO, even though no text is ever actually hidden?

Vote Up Vote Down

Login to post a comment!