18041 sujets

Questions générales et questions de débutants

[résolu] Comment centrer en height en fonction de la resolution ecran?

Salut.

donc voilà.
tout les éléments de mon site son positionnés en absolute depuis un referent " contener" placé lui en "relative" et qui me permet ainsi de le centrer automatiquement sur la largeur.
"contener" faisant 955px x 600px s'affiche correctement sur une résolution 1024x768px, mais avec une résolution supérieure, "contener" reste tout là haut.
Ca serait tellement plus esthetique de le voir centrer en height !
Quelles sont mes solutions,
merci Smiley cligne
Administrateur
lefelinherbivore a écrit :
Quelles sont mes solutions,

Hello,

Moi a priori quand me viennent ce genre de questions, je commence par avoir le réflexe de faire un tour dans la FAQ (= questions fréquemment posées).
Si jamais je n'y trouve pas de réponse, je poursuit dans les Tutoriels.
Et au pire, je fais une recherche dans le forum.

Tu as de la chance, la réponse s'y trouve clairement dans les trois endroits Smiley cligne
Modifié par Raphael (20 Jan 2007 - 12:54)
Bon je dois être neuneu...
Je cherche, mais ne trouve pas.
Des éléments de réponses cependant, mais toujours pas de solution adaptée à mon problème.
Administrateur
lefelinherbivore a écrit :
ha ?
zut, j'ai dû mal chercher... car pas trouvé.
Encore faut-il se servir des bons mots clefs.
merci.

Euh...
Le lien de la FAQ se trouve dans "Positionnement, alignement, centrage" et s'appelle "Comment centrer verticalement un élément ?"
Le lien dans les tutoriels se trouve dans "Faire une mise en page sans tableaux" et s'appelle "Centrer les éléments ou un site web en CSS".

Si tu as d'autres idées de mots-clés, je suis preneur Smiley smile

a écrit :
Des éléments de réponses cependant, mais toujours pas de solution adaptée à mon problème.
La FAQ propose 5 solutions. Au-moins l'une d'entres-elles répond à ton problème.

Ensuite, il est difficile de deviner en quoi cela ne correspond pas... tant qu'on n'a pas d'aperçu du problème Smiley ohwell
Modifié par Raphael (20 Jan 2007 - 13:25)
Les solutions proposées suggèrent de centrer des éléments à partir de bloc parent ayant une hauteur determinée.
pour moi il s'agit de centrer verticalement l'ensemble d'un site en fonction d'une résolution écran fluctuante.
lien vers site;
Merci
Administrateur
lefelinherbivore a écrit :
Les solutions proposées suggèrent de centrer des éléments à partir de bloc parent ayant une hauteur determinée.
Merci
Non, c'est l'élément à centrer qui doit généralement avoir une hauteur déterminée, pas son parent.

lefelinherbivore a écrit :
pour moi il s'agit de centrer verticalement l'ensemble d'un site en fonction d'une résolution écran fluctuante.

Si l'ensemble du site a une hauteur définie, alors plusieurs solutions sont possibles, sinon il reste toujours la dernière solution de la FAQ Smiley cligne
Modifié par Raphael (20 Jan 2007 - 13:46)
bon, si je reprends point par point ( au nombre de 5 ) le sujet de la FAQ " Comment centrer verticalement un élément ?"
ou

" = " represente la solution proposée
--> le problème rencontré

1)
= utiliser table-cell
--> marche pas avec IE<7
2)
= height/line-height
--> il ne s"agit pas déléments inline ou texte
3)
= inline-block
--> ne concerne pas mon cas de figure
4)
=table-cell / vertical-align
--> ne fonctionne pas sur ie<7
--> mon bloc parent à une taille indeterminé
5)
=vertical-align avec table
--> je n'y arrive pas...

hard...
Administrateur
lefelinherbivore a écrit :

5)
=vertical-align avec table
--> je n'y arrive pas...

hard...

A un moment, il va bien falloir nous montrer contrètement ce qui ne fonctionne pas, si tu veux que quelqu'un puisse vraiment t'aider.

Ton élément global ("site") est bien contenu dans une cellule de tableau ?
Ton tableau "conteneur" occupe bien toute la page ?
Tu as bien appliqué le vertical-align à la cellule de ton tableau ?

On va bien y arriver quand-même Smiley smile
Modifié par Raphael (20 Jan 2007 - 14:57)
ok, merci Raphaël pour ton aide.
actuellement je fais de simple de test que j'appliquerai ensuite à mon site.


<table height="100%"  >
	<tr>
                 <td height="50" bgcolor="#CCCCCC" valign="middle">drole</td>
        </tr>
</table>


ou la cellule td est censée représenter le bloc "contener" de mon site ...

Merci Smiley cligne
Administrateur
Il faut que la cellule occupe tout l'espace, c'est à dire 100% de la page en hauteur et en largeur.

Ici elle n'occupe que 50 (px, pt, %, em, ?) de haut, donc le contenu (= ton site) va devoir s'y coller.

De plus, je ne vois pas d'utilisation de la propriété CSS "vertical-align" dans ton exemple Smiley decu
un exemple concret:

<style>
body{
background-color:black;
}
table{
height:100%;
width:100%;
border:1px solid white;
}
td{
height:100%;
width:100%;
border:1px solid orange;
vertical-align:middle;
}
div#contener{
height:600px;
width:955px;
border:1px solid red;
margin:0 auto;
}
</style>
<table>
	<tr>
		<td height="100%">
			<div id="contener">
				<ul>
					<li>white=tableau</li>
					<li>orange=cellule</li>
					<li>red=mon_site</li>
				</ul>
			</div>
		</td>
	</tr>
</table>

et donc, je souhaiterais que mon site que ce soit sur une résolution ecran de 1024*768 et + ,soit centré sur l'axe vertical.
( grrr, pourquoi le tableau ne remplit-il pas toute le longueur de mon écran?)
Désolé pour cette demande basique, j'ai perdu l'habitude de me servir des tableaux... Smiley confused
MOUaaAArrFf !
J'avais totalement zappé ce méchant body{};
Bon ben voilà... problème reglé !

Merci à vous Smiley cligne
Modifié par lefelinherbivore (20 Jan 2007 - 20:00)
Sujet clos
Aller à