Soucis de CSS

MsTeshi · décembre 2011

Bonjour,

J'ai un léger soucis au niveau du CSS.

En effet, quand je suis sur mon blog via l'url principal, aucun soucis d'affichage : http://msteshi.chaosklub.com/

Par contre, quand on va sur un article, la sidebar se déplace en bas et se réduit : http://msteshi.chaosklub.com/index.php?article5/article-second-rien-n-est-noir-rien-n-est-blanc-reflexion-sur-la-consommation-l-homme-la-societe-et-le-progres-part-1

Je pense que je dois intervenir sur #sidebar sauf que je ne vois vraiment pas quoi rajouter :$

#sidebar {
float: right;
width: 30%;
border-style: groove;
border-color: #ff4666;
font-family: 'Trebuchet MS', Tahoma, Arial, Sans-Serif;
font-size: 1em;
background-image: url('http://msteshi.chaosklub.com/data/images/purple.jpg');
margin-top: 1.1em;

}

#sidebar h2 {
text-align: left;
margin-left: 2em;
color: #54e2a9;
background-color:#000000;
background-image: url('http://msteshi.chaosklub.com/data/images/purple.jpg');

}

#sidebar ul {
text-align: left;
margin: 0;
padding-top: 0.5em;
padding-bottom: 1em;
list-style: none;
background: transparent;

}

#sidebar li {
font-family: Times New Roman;
font-size: 1em;
background: transparent;

}

Jos · décembre 2011

Sur la page d'accueil, sous Firefox 9, la sidebar se chevauche avec l'article, çà fait bizarre. Sur l'article, comme tu le dis il se met en bas. Moi j'agrandirai la sidebar, tout en agrandissant l'ensemble du blog.

Stéphane · décembre 2011

Avec chrome tout est bien affiché. La sidebar reste en place.
Le problème semble être en fonction du navigateur utilisé on dirait

Jos · décembre 2011

Stéphane a écrit:

Avec chrome tout est bien affiché. La sidebar reste en place.
Le problème semble être en fonction du navigateur utilisé on dirait

Et oui, les joies de la compatibilité...

MsTeshi · décembre 2011

Oui ;-)

Mais là c'est réglé :-)

gcyrillus-nomade · décembre 2011

bonjour,

le problème était probablement du au fait (entre autre) que :
sidebar est a 30% de largeur et que ton widget est fixé a 291px de large par le script. Le widget peut du coup etre plus large que tes 30% selon la largeur de ta fenêtre.
le js de ton script:

<script type="text/javascript" src="http://widgets.twimg.com/j/2/widget.js"></script><script type="text/javascript">
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 5,
  interval: 30000,
  width: 291,  // <==================  ICI LA LARGEUR FIXE DE TON WIDGET
  height: 300,
  theme: {
    shell: {
      background: '#000000',
      color: '#54e2a9'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#ff4665'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('MsTeshi').start();

</script>

Cordialement, GC

Soucis de CSS

Réponses