deux div imbriqués

tha1nz4ne · 2 Novembre 2010

salut jai deux entete css

Code:

<style type="text/css">
 
.toto { 
position:absolute; top:200px; left:530px; 

}

Code:

#corppage {
width:1024px;
margin-top:0px;
margin-right:auto;
margin-left:auto;
margin-bottom:0px;
}

en bas :

Code:

<div id="corppage">





 <object width="1024" height="300">
<param name="movie" value="RMW4.swf">
<param name="wmode" value="transparent">
<embed src="RMW4.swf" width="1024" height="300" movie="RMW2.swf" wmode="transparent"></embed>
</object>


<div CLASS="toto">
  <form method="post" action="member.php">
  <table>
   <tr>
   <tr>
   <td><input type="text" class="inputtext" name="username"/></div></td></tr>
   <tr>
     <td><input type="password" class="inputtext" name="passwd"/></td></tr>
   <tr>
     <td colspan="2" align="center">
     <input type="submit" value="Log in"/></td></tr>
   <tr>
   </tr>
 </table></form>
 
 </div>
     
     <p ALIGN=CENTER>
     <span style="padding-left:60px"><a href="forgot_form.php">Forgot your password?</a></td></span><td colspan="2">
</P>
</div>

le corppage permet de recadré ma page si lutilisateur agrandi sa page web a nimporte kel grandeur.
et lautre (.toto) permet de placer un textfields (zone d'entré de texte) a une certaine place sur ma page.
Le probleme... impossible que le textfield puisse bénéficier des deux. Soi qui suis pas la page quand je lagrandi ou soi
que le textfield n'est pas a la bonne place sur la page web.

ps: avec le code si dessus.. le textfield est au bon endroit sur la page mais ne suis pas le reste si jagrandi.

Merci de votre aide

franckM · 3 Novembre 2010

Bonjour,

Normal car la classe toto à une position absolue (200px depuis le haut et 530px depuis la gauche) donc le navigateur va placer ton textfield à cette position fixe quelque soit la grandeur de ta page. En plus, ton code html est erroné.

Essayes ça pour le css:

Code:

<style type="text/css">
.toto{width:150px;margin-left:auto;margin-right:auto;margin-top:10px;}

#corppage {
width:1024px;
margin-top:0px;
margin-right:auto;
margin-left:auto;
margin-bottom:0px;
}
</style>

Et ça pour le html:

Code:

<div id="corppage">
<object width="1024" height="300">
<param name="movie" value="RMW4.swf">
<param name="wmode" value="transparent">
<embed src="RMW4.swf" width="1024" height="300" movie="RMW2.swf" wmode="transparent"></embed>
</object>
<div CLASS="toto">
	<form method="post" action="member.php">
  		<table>
   			<tr>
   				<td>
                	<input type="text" class="inputtext" name="username"/>
                </td>
         	</tr>
   			<tr>
    			<td>
                 	<input type="password" class="inputtext" name="passwd"/>
             	</td>
          	</tr>
   			<tr>
     			<td  style="text-align:center">
     				<input type="submit" value="Log in"/>
              	</td>
        	</tr>
		</table>
 	</form>
    <p style="text-align:center">
     	<a href="forgot_form.php">Forgot your password?</a>
	</p>
</div>
	
</div>

tha1nz4ne · 3 Novembre 2010

merci pour ta réponse, sa marche presque! Je suis capable de déplacer les textfields en plus que sa se recadre mais les textfields apparaisse en dessous de mon flash, donc je ne le voi pas. une idée?

franckM · 3 Novembre 2010

Tu peut être un peu plus...explicite disons parce que là c'est du charabia pour moi

tha1nz4ne · 3 Novembre 2010

daccord,

le code que tu ma donné est parfait mais la priorité d'affichage est que les textfield sont en arriere du fond en flash... donc je ne peux pas les voir il faudrait un ordre de priorité pour que le flash soit en arriere et les textfield en avant donc par-dessus.

tha1nz4ne · 3 Novembre 2010

Nouveauté si sa peut t'aider tout marche bien sur firefox, mais sur safari les textfield apparaisse en dessous du flash encore.

franckM · 3 Novembre 2010

Tu utilises quoi pour ta priorité d'affichage, z-index ?

tha1nz4ne · 3 Novembre 2010

rien je ne sais pas comment sa marche et si je met un nouveau css z-index pour mon flash il ne va surment pas marché puisque j'ai deja le corppage dessus <div id="corppage">

franckM · 3 Novembre 2010

Attends avec le code que je t'ai donné (css et html), tes inputs ne peuvent pas être imbriqués avec le flash, il doivent se trouver après, c'est que tu as rajouter quelque chose. Tu utilises exactement le code envoyé ?

tha1nz4ne · 3 Novembre 2010

Code:

<HTML>
<TITLE>RateMyWorld</TITLE>




<style type="text/css">


 .toto {width:20px;
  		margin-left:auto;
  		margin-right:auto;
  		margin-top:-110px;
  		;
  		}
  		
  		

#corppage {
width:1024px;
margin-top:0px;
margin-right:auto;
margin-left:auto;
margin-bottom:0px;
}



.inputtext { width: 120px; height: 25px; }





body
{ 
background-image: url('fondcaca2.png');
background-repeat: no-repeat;
background-attachment:fixed;
background-position: 50% 20%; 
}



</style>



<div id="corppage">
<object width="1024" height="300">
<param name="movie" value="RealCompletReal1.swf">
<param name="wmode" value="transparent">
<embed src="RealCompletReal1.swf" width="1024" height="300" movie="RealCompletReal1.swf" wmode="transparent"></embed>
</object>
<BODY BACKGROUND="FontTest2.jpg">
<div CLASS="toto">
   <form method="post" action="member.php">
        <table>
            <tr>
               <td>
                   <input type="text" class="inputtext" name="username"/>
                </td>
            </tr>
            <tr>
             <td>
            
                    <input type="password" class="inputtext" name="passwd"/>
                </td>
             </tr>
            <tr>
              <td  style="text-align:center">
                 <input type="submit" value="Log in"/>
                 </td>
            </tr>
            <tr>
             <td>
            <input type="checkbox" name="sports" value="remember"  /><br />
            
           </tr>
      </table>
   </form>
   
</div>
   

<p style="text-align:center">
       &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="forgot_form.php">Forgot your password?</a>
   </p>

<?php

 require_once('bookmark_fns.php');
 display_registration_form();

?>




<br><br><br><br><br><br><br>

    <img src="banner1.png"></p>

<div align="center" class="style1">
<p>      &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;RateMyWorld &copy; 2010 All Rights Reserved </p>
  </div>
  </div>
</tr>
</body>
</HTML>

franckM · 3 Novembre 2010

Tu imbriques mal tes balises. Tu mets la balise <body> après ton <object> flash donc forcément...

Tu mets un background-image pour ton body et tu rajoutes un truc BACKGROUND="FontTest2.jpg" dans ta balise body ==> à virer

Pourquoi tu mets un margin-top:-110px à ta classe toto ? c'est pour ça qu'il se fiche dans ton flash

Pourquoi tu utilises des espaces   . Il vaut mieux simplement centrer ton texte.

Ne mets pas les balises en majuscules (<TITLE> ou <P> par exemple), toujours en minuscule.

Essaies ça:

Code:

<html>
<head>
<title>RateMyWorld</title>
<style type="text/css">
.toto {width:150px;
        margin-left:auto;
        margin-right:auto;
		text-align:center;
        ;
        }
#corppage {
width:1024px;
margin-top:0px;
margin-right:auto;
margin-left:auto;
margin-bottom:0px;
}
.inputtext { width: 120px; height: 25px; }
body
{
background-image: url('fondcaca2.png');
background-repeat: no-repeat;
background-attachment:fixed;
background-position: 50% 20%;
}
</style>
</head>

<body>
<div id="corppage">
<object width="1024" height="300">
<param name="movie" value="RealCompletReal1.swf">
<param name="wmode" value="transparent">
<embed src="RealCompletReal1.swf" width="1024" height="300" movie="RealCompletReal1.swf" wmode="transparent"></embed>
</object>

<div class="toto">
   <form method="post" action="member.php">
        <table>
            <tr>
               <td>
                   <input type="text" class="inputtext" name="username"/>
                </td>
            </tr>
            <tr>
             <td>
           
                    <input type="password" class="inputtext" name="passwd"/>
                </td>
             </tr>
            <tr>
              <td  style="text-align:center">
                 <input type="submit" value="Log in"/>
                 </td>
            </tr>
            <tr>
             <td>
            <input type="checkbox" name="sports" value="remember"  /><br />
           </td>
           </tr>
      </table>
   </form>
   
</div>
   

<p style="text-align:center">
       
        <a href="forgot_form.php">Forgot your password?</a>
   </p>

<?php

require_once('bookmark_fns.php');
display_registration_form();

?>
<img src="banner1.png">

<div style="text-align:center">
<p>RateMyWorld &copy; 2010 All Rights Reserved </p>
  </div>
  </div>

</body>
</html>