28172 sujets

CSS et mise en forme, CSS3

bonjour bonsoir,

Voilà dans ma démarche de "j'aimerais comprendre un peu plus", j'aimerais comprendre quelque chose. Je suis en train d'essayer de placer 5 conteneurs en plein écran. Le truc c'est que j'arrive à avoir un bon rendu sur 3 divs, les 2 premières et la dernière, elles ont bien la taille de l'écran mais les 2 du milieu sont plus grande que prévues. J'ai essayé un peu tout et n'importe quoi, bref je sais pas quoi faire. Un peu d'aide s'il-vous-plaît ? Merci beaucoup.

et voilà le code:


<div class="test">coucou c'est moi</div>
<div class="test2">je test hein</div>
<div class="test3">cette div doit etre en absolute impérativement</div>
<div class="test4">pas d'indication de position pour celle-là</div>
<div class="test5">vla la fin</div>


le css:


.test{

	width: 100%;
	height: 100%;
	background-color: red;
	margin-top:0px;
	position: relative;
	
}

.test2{

	width: 100%;
	height: 100%;
	background-color: blue;
	padding: 0px; 
  	position: relative;
  	
}
.test3{

	width: 100%;
	height: 100%;
	background-color: green;
	padding: 0px; 
  	position: relative;
  
}

.test4{

	width: 100%;
	height: 100%;
	background-color: yellow;
	padding: 0px; 
	position: relative;
	clear:both;

}
.test5{

	width: 100%;
	height: 100%;
	background-color: orange;
	padding: 0px; 
	
	position: absolute;
}

body{
	margin: 0px;
	padding:0px;
}
salut,
pas très bien compris ce que tu cherches à faire. Tu voudrais que tes div aient la hauteur du navigateur ? Dans tous les cas, ton css contient beaucoup de choses inutiles. Il pourrait se résumer à ça

html, body {margin:0;height:100%}
div {height:100%}
.test{background-color: red}
.test2{background-color: blue}
.test3{background-color: green}
.test4{background-color: yellow}
.test5{background-color: orange}
bonjourn merci pour ta réponse. Oui le but est que les divs aient la taille du navigateur. J'ai revu effectivement mon code, après m'être bien emmêlé j'ai remis ça au clair. Passe une bonne journée.