Problème avec un widget [Fermé]

Signaler
Messages postés
29
Date d'inscription
vendredi 10 juin 2011
Statut
Membre
Dernière intervention
24 octobre 2011
-
Bonjour,

je suis en train de réaliser un site pour mon "plaisir" avec deus acteurs que j'aime beaucoup. bref... là n'est pas la question. J'ai en faite un problème avec le widget de twitter, j'aimerais qu'il soit sur l'image "twitter" (le sidebars) mais il se trouve malheureusement toujours en dessous malgrés mes changements de valeurs en "margin-top"

voici mon site : http://austin-sophia.voila.net

et le code html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Austin Nichols & Sophia Bush</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
   </head>
   <body>
  
  <div id="en_tete"><!--HEADER-->
   <div class="box1">
		<a id="box-link" href="images/header.png"></a>
		<p></p>
		</div>
    </ div>


 
</div>
   <div id="menu"><!--MENU-->
  <div class="twitter">
  <p class="widget"><script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 3,
  interval: 6000,
  width: 100,
  height: 50,
  theme: {
    shell: {
      background: '#fad978',
      color: '#ffffff'
    },
    tweets: {
      background: '#ffe0ea',
      color: '#000000',
      links: '#f213a4'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('aus10nichols').start();
</script></p>

  </div>
   <div class="elite">
   </div>
   <div class="partenaires">
   </div>
   <div class="statistiques">
   </div>
   <div class="disclamer">
   </div>
   </div>
   
   
   
      
   
   <div id="corps"><!--CORPS-->
 <p class="news">bla bla bla bla bla bla
   </p>
    <p class="news2">
   </p>
   <p class="news3">
   </p>
   <p class="news4">
   </p>
   <p class="news5">
   </p>
   <p class="news6">
   </p>
     
   
   </div> 
   
  
       
   </body>
</html>


et le css :
/*LE FOND*/

body
{
   width: 1000px;
   margin: auto; 
   margin-top: 10px;
   margin-bottom: 10px;    
   background-color: #F9CD9E;
   background-image: url("images/background.jpg");
   background-repeat: no-repeat;
   border-style: none;
}

/*MENU*/

#menu
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 50px;
   background-image: url("images/projets.png");
   background-repeat: no-repeat;
}

.twitter
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 550px;
   background-image: url("images/twitter.png");
   background-repeat: no-repeat;
}

.elite
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 50px;
   background-image: url("images/elite.png");
   background-repeat: no-repeat;
}

 
.widget
{
   margin: 0 auto;
   margin-top: 20px;
   margin-left: 10px;
}

.partenaires
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 60px;
   background-image: url("images/partenaires.png");
   background-repeat: no-repeat;
}

.statistiques
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 50px;
   background-image: url("images/statistiques.png");
   background-repeat: no-repeat;
}

.disclamer
{
   float: left; 
   width: 350px; 
   height: 500px;
   margin: 0 auto;
   margin-top: 50px;
   background-image: url("images/disclamer.png");
   background-repeat: no-repeat;
}



/*CORPS*/


#corps
{
   width: 550px;
   height: 550px;
   margin-auto: 0px;
   margin-left: 400px; 
   margin-top: 40px; 
   padding: 20px; 
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}

#corps .news2
{
   width: 550px;
   height: 550px;
   margin-top: 500px; 
   margin-left: -10px;
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}

#corps .news3
{
   width: 550px;
   height: 550px;
   margin-top: -10px; 
   margin-left: -10px;
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}

#corps .news4
{
   width: 550px;
   height: 550px;
   margin-top: -10px; 
   margin-left: -10px;
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}

#corps .news5
{
   width: 550px;
   height: 550px;
   margin-top: -10px; 
   margin-left: -10px;
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}

#corps .news6
{
   width: 550px;
   height: 550px;
   margin-top: -10px; 
   margin-left: -10px;
   color: black;
   background-image: url("images/corps.png");
   background-repeat: no-repeat;
}


.box1 
{ 
  position: relative; 
  width: 1000px; 
  height: 550px; 
  background-image: url("images/header.png"); 
  background-repeat: no-repeat; 
}
		
#box-link 
{ 
  position: absolute; 
  top: 8px; 
  left: 20px; 
  width: 1000px; 
  height: 550px; 
  background-color: transparent; 
}