28173 sujets

CSS et mise en forme, CSS3

Bonjour,

voici la structure de mon site :

http://www.alpkaida.com/css.jpg

l'entier du site n'est pas dynamique donc cette structure et les codes suivants marche parfaitement. Le problème c'est pour ma page de news, qui est en php et qui récupère 3 news par page dans la boite .news_defil.

Le problème c'est que la taille de cette boite ne s'adapte pas a la longueur des news. En plus, le .menu_bas se retrouve tout en haut de la page lorsque la boite .news_defil s'aggrandit.

J'aimerais que la boite .news_defil s'adapte a la longueur des news, et que le menu bas soit toujours en dessous de celle-ci.

Voilà mon code CSS :


.page{
	min-height : 500px;
	height :auto;
	_height:500px; // pour IE //
	width: 760px;
	position: absolute;
	top: 50%;
	left: 50%;
	vertical-align: middle;
	margin-top: -250px;
	margin-left: -380px;
}
.menu_haut {
	width: 760px;
	height:14px;
	margin-left: auto;
	margin-top: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	font-family: Arial;
	font-size: 9px;
	color: #555555;
	margin-right: auto;
	margin-bottom: 5px;
}
.news_defil {
	min-height : 384px;
	height :auto;
	_height:384px; // pour IE //
	width: 760px;
	margin-top: 15px;
}
.menu_bas {
	width: 760px;
	height:18px;
	font-family: Arial;
	font-size: 9px;
	color: #555555;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCCCCC;
	line-height: 200%;
	margin-top: 5px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
}


et voici mon code html :

 
<div class="page">
<div class="menu_haut"></div>
<div class="news_defil"></div>
<div class="menu_bas"></div>
</div>


Qu'est ce que j'ai fait de faux ??

Merci bp d'avance
Modifié par alpking (15 Jul 2006 - 13:51)
Bonjour,

alpking a écrit :


Qu'est ce que j'ai fait de faux ??


La gestion des hauteurs figées.

Laisser la page s'écouler verticalement et chaque bloc prendre librement la hauteur nécessaire en fonction de la quantité de contenu et des conditions locales de rendu (taille des caractères, interligne, etc). Bref, laisser faire le flux.
Modifié par Laurent Denis (15 Jul 2006 - 14:09)
c'est à dire ? j'ai supprimé la hauteur fixe de .menu_haut et .menu_bas mais est ce que je ne peux supprimer la hauteur des deux boites, étant donné que je veux qu'elles aient un hauteur minimum ??
j'ai tout essayé mais la je desespère...
Modifié par alpking (15 Jul 2006 - 15:48)
Salut,

A priori ton code tel qu'il est fonctionne !!
Tu dois avoir un autre problème ailleurs dans ton code qui coince
merci de votre aide,

j'ai réussi en remplacant les div par des span...

EDIT : avec les span ca marche très bien, sauf que ca ne prend pas encompte le min_height...

à l'aide !!
Modifié par alpking (17 Jul 2006 - 20:20)