Problème avc les div ,navigteur ...

Fermé
rémoundo Messages postés 408 Date d'inscription mardi 12 juin 2007 Statut Membre Dernière intervention 17 mars 2010 - 25 déc. 2009 à 09:48
rémoundo Messages postés 408 Date d'inscription mardi 12 juin 2007 Statut Membre Dernière intervention 17 mars 2010 - 26 déc. 2009 à 14:49
Bonjour,j'ai fais sur la page d'accueil de mon site un arrangement qui tient a un fil et qui ne marche que sur Firefox le problème est que sur firefox sa tient mais au moindre modification ca case ! aperçu :

avec le style="height:132em;" : http://www.monsterup.com/image.php?url=upload/1261674736982.png

sans le style="height:132em;" : http://www.monsterup.com/image.php?url=upload/1261674736972.png

cela me fais des truc que je ne comprend pas ! et la colone de droite noire je suis obliger de mettre margin-top:-960px;"

bref

le html :

	    <div class="right_haut"></div>
	    <div class="rightbk"  style="height:132em;">
		    <h2>bienvenue sur ...</h2>

<h4>
<img src="images/nintendow2.png" alt="nintendow" /><br />
Le site sur nintendo ,et mario ...</h4>
<p class="font"><img src="images/bar.png" alt="boutton" />
Bienvenue sur nintendow le site qui vous fera découvrir (ou redécouvrir) l'univers de mario et de nintendo ! 
Vous y trouver des news,des test ,des biographies ,des chose exclusives et bien plus encore ...
Ce site est optimiser pour <strong>Mozilla Firefox </strong> un navigateur superbe qui je vous recomande à 
<a href="http://www.mozilla-europe.org/fr/firefox/">télécharger ici</a>.
<br /><strong> Voila ,et ...bonne visite sur nintendow !</strong>
<br /><img src="images/bar.png" alt="boutton" /></p>
<p style="text-align:center" >
   <ul class="kwicks">  
     <li id="kwick1"><a href="#">Home</a></li>  
     <li id="kwick2"><a href="#">Contact</a></li>  
     <li id="kwick3"><a href="#">Downloads</a></li>  
     <li id="kwick4"><a href="#">Search</a></li>  
     <li id="kwick5"><a href="#">Search</a></li>  
 </ul>  

</p>
<br />  

	    <div class="right_hautx"></div>
	    <div class="rightbkx">
<p class="font2" >
<img src="images/mo.png" alt="" />
<br />  
<br /><i>01/01/10 </i><span class="dedans">Enfin ! ouverture de nintendow !!!</span>
<br />
<br /><i>01/01/10 </i><span class="dedans">on y est enfin !2010 c'est partie !</span>
<br />
<br /><i>31/12/09 </i><span class="dedans">Une année pour créer nintendow !</span>
<br />
</p>
</div>
		<div class="right_basx"></div>
	    <div class="right_hautx"></div>
	    <div class="rightbkx">
<p class="font2" >
<img src="images/mo2.png" alt="" /> 
<br />
<br />
<img src="images/encemo.png" style="margin-left:5px;" alt="" />
</p>
</div>
		<div class="right_basx"></div>
	    <div class="right_hautx"></div>
	    <div class="rightbkx">
<img src="images/mo8.png" alt="" />
<p class="font2" >
<?php include('exemple.php'); ?>
</p>
</div>
		<div class="right_basx"></div>
<div style="float: right ;margin-right:-3px;margin-top:-960px;" >
	    <div class="right_hauty"></div>
	    <div class="rightbky">
<img src="images/mox.png" alt="" /> 
<!-- Debut shoutbox - https://www.i-tchat.com/ -->
<iframe src="http://www.i-tchat.com/shoutbox/shoutbox.php?idShoutbox=80015" width="180" height="350" frameborder="0" allowtransparency="true" >Votre navigateur semble incompatible, essayez d'ouvrir le <a href="https://www.i-tchat.com/" onClick="window.open(this.href+'?80015');">tchat</a>, ou rencontrez le webmaster pour plus d'informations.</iframe>
<!-- Fin shoutbox -->
<img src="images/bar2.png" alt="" />
<p class="font2">

<img src="images/mox2.png" alt="" />
Haaa l'ouverture ... toujours un grand jour ! surtout pour nintendow un petit réseau de sites un peu vide pour l'instant mais qui va se développer <strike>et bientôt controler le monde</strike>
</p>
<p>
<img src="images/mox3.png"  alt="" />
<br />
<img src="images/dos.png" style="margin-left: 15px;" alt="" /> 
<br />
</div><div class="right_basy"></div>
</div>
<br />

<br />

	</div>


		<div class="right_bas"></div>




Le css :

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

.right_hautx {
    margin-left: 0px;
	height: 100px;
	width: 430px;
float: left ;
	position: relative;
	background: url(images/right-topx.png) no-repeat;
}

.right_basx {
    margin-left:0px;
	position: relative;
	height: 20px;
	width: 430px;
float: left ;
	background: url(images/right-bottomx.png) no-repeat;
	margin-bottom:3px;
}

.rightbkx {
    margin-left:0px;
width: 430px;
	background: url(images/right-bkx.png) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
float: left ;
	position: relative;
    padding-top: 0px;
    padding-bottom: 5px;
}

.right_hautx {
    margin-left:0px;
float: left ;
	height: 20px;
	position: relative;
	width: 430px;
	background: url(images/right-topx.png) no-repeat;
}

.right_basx {
    margin-left:0px;
float: left ;
	height: 20px;
	width: 430px;
	position: relative;
	background: url(images/right-bottomx.png) no-repeat;
	margin-bottom:3px;
}

.rightbkx {
    margin-left:0px;
	width: 430px;
float: left ;
	background: url(images/right-bkx.png) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
    padding-bottom: 5px;
	position: relative;
}

.rightbkx h2 {
    font-size: 1.3em; 
    color: #2366a7;
    margin: 0; 
	padding: 0;
    margin-bottom: 10px;
	padding-bottom: 0.3em; 
	width: 150px;
	border-bottom: 1px dashed #C0C0C0;
}


.right_hauty {
    margin-left: 0px;
	height: 100px;
	width: 210px;
	position: relative;
	background: url(images/right-topy.png) no-repeat;
}

.right_basy {
    margin-left:0px;
	position: relative;
	height: 24px;
	width: 210px;
	background: url(images/right-bottomy.png) no-repeat;
	margin-bottom:3px;
}

.rightbky {
    margin-left:0px;
width: 210px;
	background: url(images/right-bky.png) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
	position: relative;
    padding-top: 0px;
    padding-bottom: 5px;
}

.right_hauty {
    margin-left:0px;
	height: 26px;
	position: relative;
	width: 210px;
	background: url(images/right-topy.png) no-repeat;
}

.right_basy {
    margin-left:0px;
	height: 24px;
	width: 210px;
	position: relative;
	background: url(images/right-bottomy.png) no-repeat;
	margin-bottom:3px;
}

.rightbky {
    margin-left:0px;
	width: 180px;
	background: url(images/right-bky.png) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
    padding-bottom: 5px;
	position: relative;
}

.rightbky h2 {
    color: #2366a7;
    margin: 0; 
	padding: 0;
    margin-bottom: 1px;
	padding-bottom: 0.3em; 
	width: 150px;
	border-bottom: 1px dashed #C0C0C0;
}

.right_haut {
    margin-left:0px;
	height: 20px;
	width: 665px;
	position: relative;
	background: url(images/right-top.png) no-repeat;
}

.right_bas {
    margin-left:0px;
	height: 20px;
	width: 665px;
	position: relative;
	background: url(images/right-bottom.png) no-repeat;
	margin-bottom:3px;
}

.rightbk {
    margin-left:0px;
	width: 635px;
	background: url(images/right-bk.jpg) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
    padding-bottom: 5px;
	position: relative;
}

.right_haut {
    margin-left: 0px;
	heigth: 100px;
	width: 665px;
	position: relative;
	background: url(images/right-top.png) no-repeat;
}

.right_bas {
    margin-left:0px;
	heigth: 20px;
	width: 665px;
	position: relative;
	background: url(images/right-bottom.png) no-repeat;
	margin-bottom:3px;
}

.rightbk {
    margin-left:0px;
	width: 635px;
	background: url(images/right-bk.png) repeat-y;
	padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
    padding-bottom: 5px;
	position: relative;
}



d'où vient le problème ,comment rendre compatible tout navigateur (ou presque) ?

j'attends vos réponses !

merci d'avance je l'espère !

A voir également:

1 réponse

rémoundo Messages postés 408 Date d'inscription mardi 12 juin 2007 Statut Membre Dernière intervention 17 mars 2010 17
26 déc. 2009 à 14:49
up !
0