El código Me gusta de Facebook da errores de css/javascript

quiero agregar un módulo simple de "me gusta" de Facebook a mi sitio. Estoy usando un código generado desde el sitio de desarrolladores de Facebook y agregué esto justo después de abrir la etiqueta del cuerpo:

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/pl_PL/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

y luego dentro de la página:

<div class="fb-like" data-href="my site url here" data-send="false" data-width="550" data-show-faces="false"></div>

parece funcionar bien, excepto que este código me da muchas advertencias css/js que veo en el firebug como:

unknown property „-moz-border-radius”, unknown property: "moz-outline-style.3",[],function(a,b,c,d,e,f){(function(){var g={}.toString,h,i,j,k=e.exports={},l...

hay muchos errores de este tipo.

¿Sabes cómo arreglar ésto? toda la página parece funcionar bien, pero no me gusta tener este tipo de problemas en mi página. También estoy usando jquery dentro de esta página, ¿así que tal vez esto cause algunos problemas?

preguntado el 08 de septiembre de 12 a las 09:09

1 Respuestas

Esos errores que está recibiendo se deben a que hay algunas propiedades CSS que deben definirse en más de una forma, para maximizar la compatibilidad con diferentes navegadores.

Estas adiciones a las declaraciones estándar se denominan prefijos de proveedor. Para obtener más información, es posible que desee echar un vistazo a este artículo: pequeño enlace.

Por ejemplo, tome el siguiente CSS:

.roundcorners {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

-moz-border-radius es para la versión anterior de Firefox, las más nuevas son compatibles border-radius. -webkit-border-radius es para navegadores con tecnología WebKit (Chrome, Safari).

En otras palabras, no hay forma de evitar tener esos errores siempre que desee que el botón Me gusta funcione en la mayoría de los navegadores modernos.

Nota: que cuando un navegador ve una propiedad/regla desconocida, ignora la declaración, por lo que siempre que sus reglas sean ordenado correctamente, entonces esto es inofensivo.

Respondido el 08 de Septiembre de 12 a las 09:09

ok, entiendo esto, pero también tengo un error con la propiedad Superior y Derecha en líneas como: .fb_dialog_close_icon{background:url(static.ak.fbcdn.net/rsrc.php/v2/yA/x/IE9JII6Z1Ys.png) desplazamiento sin repetición 0 0 transparente;_imagen-de-fondo:url(static.ak.fbcdn.net/rsrc.php/v2/y6/x/…\9;derecha:7px\9}. ¿Por qué usan valores como top:8px\9;right:7px\9 ? extraño - abiku

@abiku No quiero sonar grosero pero, ¿por qué te importa? :) Estos son probablemente trucos para navegadores específicos (o también podrían ser problemas de codificación), siempre que funcione, no se preocupe. No puede obtener una página sin errores que tenga trucos específicos del navegador. Estoy seguro de que los desarrolladores front-end de Facebook lo pensaron lo suficiente, no se preocupen :P - Chris

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.