Bonjour à tous,
je bloque sur une dernière chose concernant ce site, que j'ai mis sur un serveur en test :
http://www.di-credico.com/test
Le texte en bas à gauche, qui est aligné à droite et au centre (avec plein de marques et autres) change de place selon les résolutions sur Chrome (sur IE ça ne bouge pas une fois bien placé.)
J'ai bien tout vérifié le code, et normalement ça devrait marcher car j'ai aligné tous les éléments en px par rapport au body qui est fixe.
Alors pourquoi seul ce texte bouge???
Si quelqu'un a une idée, merci d'avance de me faire signe!
Mon code html
Mon css
je bloque sur une dernière chose concernant ce site, que j'ai mis sur un serveur en test :
http://www.di-credico.com/test
Le texte en bas à gauche, qui est aligné à droite et au centre (avec plein de marques et autres) change de place selon les résolutions sur Chrome (sur IE ça ne bouge pas une fois bien placé.)
J'ai bien tout vérifié le code, et normalement ça devrait marcher car j'ai aligné tous les éléments en px par rapport au body qui est fixe.
Alors pourquoi seul ce texte bouge???
Si quelqu'un a une idée, merci d'avance de me faire signe!
Mon code html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Document sans nom</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" charset="utf-8" />
</head>
<style type="text/css">
</style>
<script>
</script>
<body>
<!-- COLONNE GAUCHE -->
<div id="left">
<div id="titre">DI.CREDICO</div><div id="droite">artiste<br />peintre<br />performer</div><br /><br />
<div id="texteg"><b>Faites entrer l’art dans vos
événements et faites vivre à
votre public un moment unique et inoubliable.</b>
<br /><br />
Peindre une toile de grande
dimension, devant public et de manière spontanée est une
discipline artistique à part entière,
le happening pictural. <b>DI.CREDICO</b> connaît bien cette discipline pour l’avoir pratiquée depuis quelques années, dans le monde entier.
<br /><br />
Véritable chorégraphie
de gestes et de couleurs,
rehaussée par une ambiance
musicale, ce moment inoubliable est un spectacle d’exception.
De moyenne ou de grande dimension*, d’une durée facilement
adaptable à votre timing, pour un gala, un salon ou toutes autres
manifestations, les happenings de <b>DI.CREDICO</b> s’adaptent parfaitement en toutes circonstances.
<br /><br />
L’oeuvre une fois réalisée, ainsi que les droits de reproductions (photos, vidéos), deviennent la propriété de votre client. <br /><br />
<div id="petit">L’article 238 bis AB du Code Général des Impôts permet également à votre client de déduire du résultat sur cinq ans, la somme totale de l'acquisition de l’oeuvre.</div>
<br /><br />
<div id="centre">Contact
</div>
<div id="marque">LES NATIONS UNIES<br />
AIR FRANCE<br />
SUEZ<br />
FRANCE TELECOM<br />
DANONE<br />
CCI FRANCO USA<br />
MARTINET<br />
RENAULT PEUGEOT<br />
BOVET FLEURIER<br />
PININFARINA<br />
HOTELS B&B <br />
SANOFI AVANTIS<br />
LABORATOIRE AMGEN<br />
ORCHESTRE DE MOSCOU
</div>
</div>
</div>
<!-- CONTENU -->
<div id="content">
<object width="550" height="300"><param name="movie" value="http://www.youtube.com/v/HqgAyw2DUPk?version=3&hl=fr_FR&autohide=1&controls=0&showinfo=0&start=04&rel=0">
</param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed
src="http://www.youtube.com/v/HqgAyw2DUPk?version=3&hl=fr_FR&autohide=1&controls=0&showinfo=0&start=04&rel=0" type="application/x-shockwave-flash" width="550" height="300"
allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div>
<!-- COLONNE DROITE -->
<div id="right">
<div id="titre2">
FAITES ENTRER <br />
L’ART <br />
DANS VOS <br />
EVENEMENTS<br />
</div>
<div id="shan"></div>
<div id="sey"></div>
<div id="mos"></div>
<div id="onu"></div>
<div id="ville">PARIS<br />
GENEVE<br />
AMSTERDAM<br />
VARSOVIE<br />
DUSSELDORF<br />
ISTANBUL<br />
MOSCOU<br />
AJACCIO<br />
PEKIN<br />
SHANGHAI<br />
NEW YORK<br />
LOS ANGELES<br />
DUBAI<br />
ABU DAHBI<br />
</div>
</div>
<hr class="clear" />
</body>
</html>Mon css
body
{
width : 1400px;
height : 720px;
margin : 0 auto;
margin-top : 20px;
background : url(../images/fond.png) no-repeat center;
background-color : black;
}
a img{
border-style: none;
}
#texteg
{
font-size : 12pt;
text-align: left;
font-family : arial;
margin-right : 100px;
margin-top : -100px;
margin-left : 20px;
}
#petit{
font-size : 9pt;
text-align: left;
font-family : arial;
font-style: italic;
}
#centre
{
text-align : center;
font-size : 12pt;
}
#titre{
font-family : arial;
font-size : 22pt;
font-weight: bold;
margin-left : 20px;
letter-spacing : 40pt;
margin-top : 10px;
}
#titre2{
font-family : arial;
font-size : 22pt;
color : white;
text-align : left;
margin-left : -260px;
margin-top : 10px;
}
#droite{
font-family : arial;
font-size : 18pt;
text-align : right;
line-height : 26pt;
margin-right : -270px;
}
#ville{
font-family : arial;
font-size : 12pt;
color : white;
text-align : left;
margin-left : -265px;
margin-top : -250px;
}
#marque{
font-family : arial;
font-size : 12pt;
text-align : right;
margin-right : -370px;
margin-top : -218px;
}
#shan{
background-image : url(../images/shan.png);
background-repeat:no-repeat;
background-position : right;
height : 165px;
margin-top : -130px;
margin-right : 30px;
}
#sey{
background-image : url(../images/sey.png);
background-repeat:no-repeat;
background-position : right;
height : 165px;
margin-right : 150px;
}
#mos{
background-image : url(../images/mos.png);
background-repeat:no-repeat;
background-position : right;
height : 165px;
margin-right : 30px;
}
#onu{
background-image : url(../images/onu.png);
background-repeat:no-repeat;
background-position : right;
height : 210px;
margin-right : 30px;
margin-left:-70px;
}
.clear {clear:both;display:block;height:0;margin:0;padding:0;border:0;visibility:hidden;}
*:first-child+html .clear{margin:-8px 0;} * html .clear{margin:-8px 0;}
#left, #right, #content { float:left; }
#left { width:425px;}
#right { width:425px;}
#content { width:550px;
margin-top : 150px;
}
