28172 sujets

CSS et mise en forme, CSS3

Problème de div sur IE

Voila nous somme 2 sur un projet et nous arrivons pas encor sur un site qui passe bien sur les différents navigateurs sauf sur IE
Le lien du site en construction est :
http://www.vadelio.info/cavalero/V3/
ce site est en version beta rien est fait ni même fini on na fait uniquement 2 pages
mais pourriez vous si cela est posible nous donné un hack pour se navigateur qui fait chier

merci a ce qui s'attarde sur le sujet

le code html :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Cavalero</title>
<link rel="stylesheet" type="text/css" media="screen,projection" href="style.css" />
<script type="text/javascript" src="script/bsn.Crossfader.js"></script>
</head>
<body>
	<div id="pageindex">
		<div id="top">
		<a href="index.htm"> </a>
		</div>
		<div id="ecran">
			<div class="crossfadinghaut" id="cfindex1">
			</div>
			<div class="crossfadinghaut" id="cfindex2">
			</div>
			<div class="crossfadinghaut" id="cfindex3">
			</div>
		</div>
		<p id="langue"><a href="accueil_fr.htm"><span>></span> Français</a><a href="accueil_fr.htm"><span>></span>  English</a></p>
	</div>
<script type="text/javascript">
	var cfhaut = new Crossfader( new Array('cfindex1','cfindex2','cfindex3'), 3000, 2000 );
</script>
</body>
</html>

le code CSS :

body{
font-family: trebuchet, arial, verdana, sans-serif;
background:#ffffff;
text-align:center;
margin:30px 0 0 0;
padding:0;
}
#pageindex{
border:1px solid #ffffff;
width:1000px;
margin:0 auto;
padding:0;
}
#page{
border:1px solid #3b3a3a;
width:1000px;
margin:0 auto;
padding:0;
}
#topindex{
background:url(img/logo_cavalero.png) 0 0 no-repeat;
height:50px;
margin:5px 0 8px 15px;
}
#top{
background:url(img/logo_cavalero.png) 0 0 no-repeat;
height:50px;
margin:5px 0 8px 15px;
}
#ecran{
height:400px;
margin:0 15px 0;
padding:0;
}
.crossfadinghaut{
height:400px;
margin:0;
padding:0;
}
#cfindex1{
background:url(img/femme1index.png);
width:970px;
height:400px;
margin:0;
padding:0;
}
#cfindex2{
background:url(img/femme2index.png);
width:970px;
height:400px;
margin:0;
padding:0;
}
#cfindex3{
background:url(img/cavalero-index.png);
width:970px;
height:400px;
margin:0;
padding:0;
}
/*Menu
-------------------------------*/
#menu{
margin:0;
height:20px;
}
#menu ul{
height:20px;
}
#menu ul li{
list-style-type:none;
float:left;
}
#menu ul li a{
text-align:left;
text-decoration:none;
font-size: 0.85em;
font-variant:small-caps;
color:#1A1A1A;
margin:0 30px 0 0;
padding:0;
}
#menu ul li a:hover{
color:#7a6200;
}

/*Langue
-------------------------------------*/
p#langue{

}
p#langue a span{
color:#1a1a1a;
font-size:1.0em;
font-variant:small-caps;
text-decoration:none;
margin: 0;
padding:0;
}
p#langue a{
color:#1a1a1a;
font-size:0.9em;
font-variant:small-caps;
text-decoration:none;
margin: 0 20px;
padding:0;
}
p#langue a:hover{
color:#a0882a;
}
/*Accueil
------------------------------------*/
.crossfading{
height:132px;
margin:0;
padding:0;
}
/*ahg
------------------------------------*/
#ahg{
float:left;
width:322px;
height:132px;
margin:0 1px 0 0;
padding:0;
}
#cfahg1{
background:url(img/img_9/femme_1.1.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfahg2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*ahc
------------------------------------*/
#ahc{
float:left;
width:322px;
height:132px;
margin:0 1px;
padding:0;
}
#cfahc1{
background:url(img/img_9/femme_2.1.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfahc2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*ahd
------------------------------------*/
#ahd{
float:left;
width:322px;
height:132px;
margin:0 0 0 1px;
padding:0;
}
#cfahd1{
background:url(img/img_9/femme_3.1.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfahd2{
background:url(img/img_9/txt-menu-n.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*acg
------------------------------------*/
#acg{
float:left;
width:322px;
height:132px;
margin:2px 1px 2px 0;
padding:0;
}
#cfacg1{
background:url(img/img_9/femme_1.2.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfacg2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*acc
------------------------------------*/
#acc{
float:left;
width:322px;
height:132px;
margin:2px 1px;
padding:0;
}
#cfacc1{
background:url(img/img_9/femme_2.2.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfacc2{
background:url(img/img_9/txt-menu-n.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*acd
------------------------------------*/
#acd{
float:left;
width:322px;
height:132px;
margin:2px 0 2px 1px;
padding:0;
}
#cfacd1{
background:url(img/img_9/femme_3.2.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfacd2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*abg
------------------------------------*/
#abg{
float:left;
width:322px;
height:132px;
margin:0 1px 0 0;
padding:0;
}
#cfabg1{
background:url(img/img_9/femme_1.3.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfabg2{
background:url(img/img_9/txt-menu-n.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*abc
------------------------------------*/
#abc{
float:left;
width:322px;
height:132px;
margin:0 1px;
padding:0;
}
#cfabc1{
background:url(img/img_9/femme_2.3.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfabc2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
/*abd
------------------------------------*/
#abd{
float:left;
width:322px;
height:132px;
margin:0 0 0 1px;
padding:0;
}
#cfabd1{
background:url(img/img_9/femme_3.3.png);
width:322px;
height:132px;
margin:0;
padding:0;
}
#cfabd2{
background:url(img/img_9/txt-menu-n.b.png);
width:322px;
height:132px;
margin:0;
padding:0;
}


/*Pied
---------------------------------------*/
#adress{
}
#adress p{
color:#595959;
font-size:0.6em;
margin:10px 0;
padding:0;
}
#adress a{
color:#595959;
text-decoration:none;
margin:0;
padding:0;
}
#adress a:hover{
color:#1a1a1a;
}
/*Option
---------------------------------------*/
hr{
height:1px;
clear:both;
visibility:hidden;
margin:0;
padding:0;
}
#ecran p a{
font-size:15px;
font-weight:bold;
display:block;
width:322px;
height:132px;
margin:0;
padding:0;
text-decoration:none;
}
#top a{
font-size:15px;
font-weight:bold;
display:block;
width:281px;
height:50px;
margin:0;
padding:0;
text-decoration:none;
}
Bonjour.

CF : Petit cours d'ethymologie

Ça peut paraître brutal, et... ma foi, ça ne coûte pas si cher d'être poli.

En fait, c'est surtout que tu ne nous dis pas ce qui ne va pas. On ne sait pas comment ton site fonctionne, ni ce qui bug. J'ai suivi ton lien. C'est un énoOoOorme JS avec des tableaux qui fait ramer mon vieux PC. Je ne vais pas lire ce long CSS sans savoir ce que j'y cherche. J'espère que tu comprendras mon point de vue.

Bien cordialement, SD.
Modifié par SiDi (27 Mar 2008 - 17:42)
Salut,

Je n'est pas comprit ce que tu entend par hack ?

En ce qui concerne le site , c'est effectivement pas super fluide tu devrai plutot te pencher vers une techologie Flash, plutot que javascript pour ce que j'ai pu voir sur la page.

Sinon je n'est pas cerné le problème, pourrait-tu refomuler ta question ?

++
Merci pour Le Bonjour je l'avais zapé (kan on né dans le travail on oublie de temps en temps les règles de bonne conduite )
je men excuse....

Alors voila pour votre non compréhension de mon prob
je récapitule ma question sur ie les image qui sont changer par un système de Javascript
sont décaler sur la droite et sorte de ma div

un hack pour ie serai t'il possible se que s'entend par hack se serai un système qui permettrai de forcer les image a resté dans ma div

Merci d'avance pour vos réponse rapide

Le flash je ne veut pas passez par cette solution mais sinon cela serai possible je le c'est très bien
Modifié par Coconuts (28 Mar 2008 - 12:24)
Sujet clos
Aller à