Discussion :

[Kanapesh]

Bonjour ,

Voila un bon moment déjà que je creuse ma tête de débutant afin de résoudre mon problème.

J'aimerais mettre en page un contenu sous forme de cadres disposés à des endroits précis (voir schéma à la fin).

Voici le code que j'utilise pour mes cadres:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<style type="text/css">
<!--
body {
font-family: verdana, sans-serif;
font-size: 0.8em;
}
#cadre {			/* conteneur global et arrière-plan du titre du cadre */
width: 300px;
padding-top: 38px;
background: url(imgs/cadre_top.jpg) top left no-repeat;
float:left;
margin:10px;
}
#bloccadre {			/* arrière-plan des bords sur l'ensemble du cadre */
 
background: url(imgs/cadre_bords.jpg) left repeat-y;
overflow:auto;
height:600px;
}
#bloccadre p {
margin:0 20px;
}
#blocbas { 			/* image bas du cadre*/
width:250px;
background: url(imgs/cadre_bottom.jpg) bottom left no-repeat;
padding-bottom:15px;
}
 
-->
 
</style>	
	<div id="cadre">
		<div id="bloccadre">
			<p>Quam ob rem circumspecta ... Ennius recte.
			</p>
		</div>
		<div id="blocbas">
		</div>
	</div>

Ce qui ce passe c'est que lorsque j'inclus dans ma page HTML 2 cadres avec des noms différents et que je modifie la hauteur des bords de l'UN des deux , il me change la hauteur fixe sur les deux sans distinction.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

div#bloccadre {height:600px;}

J'ai eu beau me retourner la tête (ainsi que google) je n'ai rien trouvé qui aurait pu m'aiguiller vers une bonne solution. Aussi je me tourne vers vous.
N'hésitez pas à me demander des explications plus précises si vous avez pas compris quelque chose , j'ai le sentiment d'avoir été plutôt flou .

Merci.

[GihefBey]

Bonjour,

En effet, des explications sont nécessaires.

L'image ne correspond pas au code.
Donne tout.

Que veux-tu faire exactement ?
Obtenir un design figé dont les dimensions ne changeront pas ?
Qu'est-ce qui bouge qui ne devrait pas ?
Utilise les noms (les id des <div>) que tu as créés pour l'indiquer.

++
Enlève les "div" des noms de tes styles, ils sont inutiles (div#cadre).

Quand on parle de cadres en HTML il s'agit de frame.
Ici, on dirait plutôt blocs ou <div>...

-

[Kanapesh]

En effet le code ne correspond pas à l'image que j'ai joint car c'est le but que j'aimerais atteindre , des blocs figés que je pourrais redimensionner à ma guise en changeant juste la hauteur.

Le problème c'est que lorsque je crée 2 codes différents avec une hauteur différente et que je les inclus dans ma page cote à cote , l'un prend la même hauteur que l'autre au lieu de conserver la sienne.

Ainsi quand je veux avoir un bloc de 500px de haut a coté d'un autre de 300px , les deux feront 500px par exemple.

Mon soucis c'est que je ne veux pas faire ma mise en page dans un tableau car ça n'est pas conforme (et je sais même pas si ça serait possible dans mon cas^^') et que je suis a court d'idée.

[Kanapesh]

Et voilà , j'ai finalement réussi a résoudre mon problème.

C'était au final plutôt bête comme erreur car juste une question de logique.
Étant donné que je prenais toujours le même code pour tous mes blocs dans une page HTML , les données css étaient utilisées entre elles d'un bloc à l'autre , quand je changeait des valeurs dans #bloccadre , celles ci étaient prises en compte dans chacun de mes blocs.
En les renommant différemment tout simplement , le problème disparait ^^

Merci à ceux qui auront pris le temps de lire.