Imbriquer deux div en un

Version imprimable

Salut !

J'ai un soucis, j'ai deux div que je voudrais faire rentrer dans un autre, comme ça:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 div#globalfiche { margin-left: 25%; margin-right: 25%; margin-top: 5%; border: 2px solid black; } div#partiephoto { float: left; border: 2px solid black; } div#partieinfosphotos { float: right; border: 2px solid black; }
Mais le soucis c'est que j'ai mon div global et en dehors, les deux autres :bug:

Quelqu'un peut m'aider svp ?

Merci d'avance...

01/04/2007, 20h21
Dan_A

Sans l'HTML, difficile de donner une solution.
Il faut sans doute un clear ou/et inclure les divisions flottantes...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
<div id="globalfiche"> 
			  <br /><br /><br /><br />
			  <div id="partiephoto"> 
	            <form enctype="multipart/form-data" action="func_upload.php" method="POST">
                  <b>Envoyer le fichier :</b><br /><br />
                  <input type="hidden" name="posted" value="1" />
                  <input name="fichier" type="file" />
                  <input type="submit" value="Uploader" />
	            </form>
			<?php
 
			//============================================================ 
            //  FORMULAIRE LISTE DEROULANTE
            //============================================================ 
 
			?>
	            <form>
                  <select>
			        <?php
 
                    $SQL = "SELECT * FROM produit;";
                    $res = mysql_query($SQL);
                    while($val=mysql_fetch_array($res)) 
			         {
                      echo "<option>".$val["PHOTOPROD"]."\n";
                     }
				     ?>
		          </select>
			    </form>   	
		      </div>
			<?php
 
			//============================================================ 
            //  FORMULAIRE INFORMATIONS PRODUITS
            //============================================================ 
			?>
			<div id="partieinfosphotos">
			  <br />
			  <form method="POST" action="func_connexion.php" name="AVIS">
				<p>Nom du produit :<br>
				<input type="text" name="nomprod" size="20">
 
				<p>Description du produit :<br>
				<input type="text" name="descprod" size="20"></p>
 
				<p>Date d'arrivée du produit :<br>
				<input type="text" name="dateprod" size="20"></p>
 
				<p>Quantité du produit :<br>
				<input type="text" name="qteprod" size="20"></p>
 
				<p>Prix du produit :<br>
				<input type="text" name="mdp" size="20"></p>
 
				<p>&nbsp;</p>
				<p>
				<input type="submit" value="Envoyer" name="envoyer">&nbsp;&nbsp;&nbsp;
				<input type="reset" value="Recommencer" name="recommencer"> <br>
				<br>
				</p>
			  </form>
			</div>
		    </div>

01/04/2007, 21h32
Bisûnûrs

Merci de donner le code généré par le navigateur et non pas le code PHP.

Sinon, comme Dan_A, je penche pour un clear.
Tu devrais essayer les solutions données par les membres avant de reposter ton code, je suis sûr que tout le monde gagnerait du temps.

Citation:

Envoyé par Bisûnûrs

Tu devrais essayer les solutions données par les membres avant de reposter ton code, je suis sûr que tout le monde gagnerait du temps.

Si on me demande mon code, je poste mon code. De plus il suffit d'ouvrir les yeux pour voir que les "solutions données" ne sont pas foule ! De ce fait j'apprécierais d'éviter les pseudos reproches inutiles svp. Quand on me donne des solutions je les essaie. C'est vrai que ce serait très logique que je revienne poster sur le forum si je m'étais débloqué grâce à tes fameuses "solutions données"...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
<!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>SimPC</title>	
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
		<link href="style.css" rel="stylesheet" type="text/css" />
		<!--[if lte IE 6]>
		   <link href="./forme/style_IE.css" rel="stylesheet" type="text/css" />
		<![endif]-->
	</head>
 
	<body>
	  			<div id="globalfiche"> 
			  <br /><br /><br /><br />
 
			  <div id="partiephoto"> 
	            <form enctype="multipart/form-data" action="func_upload.php" method="POST">
                  <b>Envoyer le fichier :</b><br /><br />
                  <input type="hidden" name="posted" value="1" />
                  <input name="fichier" type="file" />
                  <input type="submit" value="Uploader" />
	            </form>
				            <form>
                  <select>
 
			        <option>59805.jpg
<option>345789.jpg
<option>
<option>images
		          </select>
			    </form>   	
		      </div>
						<div id="partieinfosphotos">
			  <br />
			  <form method="POST" action="func_connexion.php" name="AVIS">
				<p>Nom du produit :<br>
 
				<input type="text" name="nomprod" size="20">
 
				<p>Description du produit :<br>
				<input type="text" name="descprod" size="20"></p>
 
				<p>Date d'arrivée du produit :<br>
				<input type="text" name="dateprod" size="20"></p>
 
				<p>Quantité du produit :<br>
				<input type="text" name="qteprod" size="20"></p>
 
 
				<p>Prix du produit :<br>
				<input type="text" name="mdp" size="20"></p>
 
				<p>&nbsp;</p>
				<p>
				<input type="submit" value="Envoyer" name="envoyer">&nbsp;&nbsp;&nbsp;
				<input type="reset" value="Recommencer" name="recommencer"> <br>
				<br>
				</p>
 
			  </form>
			</div>
		    </div>
				              </select>
            </form>
	</body>
</html>

J'ai mis ça:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
div#globalfiche
 {
   margin-left: 25%;
   margin-right: 25%;
   margin-top: 5%;
   border: 2px solid black;
 }
 
div#partiephoto
 {
  clear: both;
  border: 2px solid black;
 }
 
div#partieinfosproduits
 {
  border: 2px solid black;
 }

Mais les deux formulaires sont l'un au dessus de l'autre donc c'est pas exactement ce que je veux :cry:

Code:

1
2
3
4
5
6
7
8
9
10
11
<div id="cadre">
   <div id="gauche">
      <!-- premier flottant -->
   </div>
   <div id="droite">
      <!-- deuxieme flottant -->
   </div>
   <br style="clear:both" />
   <!-- le br en clear:both à la fin du cadre agrandit ce dernier vers le bas
   jusqu'à la fin des flottants -->
</div>

L'autre solution aurait été de donner des valeurs de dimension (width;height) à tes flottants.

02/04/2007, 12h16
Candygirl

Hello,

Je t'invite à lire les pistes que je donne sur ce sujet, si cela correspond bien à ta problèmatique...