2010-12-07 7 views
1

J'ai intégré un widget twitter sur mon site en utilisant leur code d'intégration. Mais après l'avoir mis sur ma page web les lettres sont trop grandes et la taille de tout cela est fausse. Les lettres sont trop grandes et le style du widget n'est pas proportionné.Twitter Widget est déformé par CSS. Comment puis-je le réparer

Toutes les informations de style nécessaires se trouvent réellement dans le code javascript. Mais il semble que quelque chose prévale le style et le rejette.

Voici le code du widget.

<script src="http://widgets.twimg.com/j/2/widget.js"></script> 
<script> 
new TWTR.Widget({ 
    version: 2, 
    type: 'profile', 
    rpp: 4, 
    interval: 6000, 
    width: 160, 
    height: 300, 
    theme: { 
    shell: { 
     background: '#333333', 
     color: '#ffffff' 
    }, 
    tweets: { 
     background: '#000000', 
     color: '#b68e59', 
     links: '#cccccc' 
    } 
    }, 
    features: { 
    scrollbar: false, 
    loop: false, 
    live: false, 
    hashtags: true, 
    timestamp: true, 
    avatars: false, 
    behavior: 'all' 
    } 
}).render().setUser('BigNotch').start(); 
</script> 

Et voici le lien vers la page sur laquelle elle se trouve. http://notchtheguru.com

comment puis-je résoudre ce problème?

Répondre

0

Le fichier javascript contient du code CSS qui affecte le style de votre widget.

Je vous recommande d'enregistrer votre propre copie du widget et de l'enregistrer sur votre serveur web, afin de pouvoir en éditer le contenu.

La taille de la police est à venir comme 18/20px, donc si vous trouvez la classe suivante et réduire la taille de la police, il devrait ressembler davantage à ce que vous recherchez - quelque chose comme ceci:

.twtr-tweet-wrap { 
    font-size: 14px; // Or whatever size you choose... 
} 
+0

Existe-t-il un moyen de simplement isoler le code ou quelque chose. Même lorsque je change la police, tout le style du widget est foiré. –

1

je me suis dit il dehors, alors maintenant je vais répondre à ma propre question :) (peut-être quelqu'un esle se heurtera à ce problème)

Ce que j'ai fait a été mis le widget dans un conteneur div. J'ai mis la police sur le div du containeur, mais vous n'avez rien à faire pour la plongée en conteneur.