problème widget - Forum HTML / CSS / XHTML

La Communauté Webmaster

  Forum-webmaster
  Technique - programmation
  HTML / CSS / XHTML (Modérateurs: Shain, Netah, Lilian, lauryv, ToToMaStEr)
  problème widget

« Précédent Suivant »

Pages: [1]

Auteur

Sujet: problème widget (Lu 878 fois)

problème widget
« sur: le 08-07-2011 a 13:11:26 »

marjo
Membre récent

Hors-Ligne

Messages: 25

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 :
Code:
<!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">
<div class="box1">
      <a id="box-link" href="images/header.png"></a>
      <p></p>
      </div>
</ div>

</div>
<div id="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">
<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
Code:
/*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;
}

merci d'avance !!!