Se connecter / S'enregistrer
Votre question

centrer verticalement le contenu d'une div ?

Tags :
  • Architecture
  • Programmation
Dernière réponse : dans Programmation
10 Février 2008 11:56:02

Bonjour,

je voudrais savoir comment on fait pour centrer verticalement le contenu d'une div, sachant que ma div a une hauteur aléatoire.

Merci

Autres pages sur : centrer verticalement contenu div

a c 232 L Programmation
11 Février 2008 12:44:42

Salut,

http://css.alsacreations.com/Faire-une-mise-en-page-san...

  1. #global {
  2. position:absolute;
  3. left: 50%;
  4. top: 50%;
  5. width: 700px;
  6. height: 400px;
  7. margin-top: -200px; /* moitié de la hauteur */
  8. margin-left: -350px; /* moitié de la largeur */
  9. border: 1px solid #000;
  10. }
14 Février 2008 16:03:49

d'accord merci pour la réponse. En fait ça fait pas ce que je voudrais. Vu l'architecture de mon site, je peux pas centrer comme ça.

Est-il possible de récupérer et stocker dans un variable la hauteur d'une div à chaque affichage alors que cette hauteur change à chaque affichage en fonction du contenu de la div.

Je sais pas si je me suis bien expliquer ...
Contenus similaires
a c 232 L Programmation
14 Février 2008 17:00:45

Salut,

Tu peux la récupérer en javascript.
document.getElementById('tonelement').offsetHeight
14 Février 2008 18:23:30

merci beaucoup ça m'avance déjà bien.
Par contre je comprends pas pourquoi mon code fonctionne pas :

  1. echo '<script language="Javascript">
  2. var message=\'<table border="1" height="\';
  3. message+=document.getElementById("hauteur").offsetHeight;
  4. message+=\'">\';
  5. document.write(message);
  6. </script>';


L'attribut border fonctionne mais pas le height. Alors que j'ai testé par une autre méthode, la récupération de la valeur fonctionne : j'ai bien mis l'attribut id à ma div dont je récupère le hauteur.

??
a c 232 L Programmation
14 Février 2008 19:34:07

Essaie de mettre style="height:XXX" plutôt que height="".
14 Février 2008 20:05:26

c'est malheureusement pas mieux
a c 232 L Programmation
14 Février 2008 20:47:09

Est-ce qu'on pourrait avoir plus de code que ça ?
15 Février 2008 08:09:51

Citation :
echo '<script language="Javascript">


C'est pas un peu abérant ?
15 Février 2008 09:21:32

comment fait-on alors pour récupérer une variable javascript en php ?
15 Février 2008 09:26:58

De toute facon il n'y aura jamais de valeur ... var message=\'<table border="1" height="\';
15 Février 2008 12:42:03

peux-tu m'expliquer stp. Je suis désolé j'ai du mal à te suivre
15 Février 2008 13:03:15

Normalement tu fais du php à ce que je vois ( d'où le echo ... vive les templates mais soit ce n'est pas le sujet de discution ).

Ton echo ici présent va écrire comme code html :


# <script language="Javascript">
# var message=\'<table border="1" height="\';
# message+=document.getElementById("hauteur" ).offsetHeight;
# message+=\'">\';
# document.write(message);
# </script>
Je n'en vois tjs pas l'interet , mais soit .

Ce qui produira comme effet ceci :

<table border="1" height="\'00 </script>

00 parce que j'ai aucune idée si le getElementById va te renvoyer qqch ou pas.

Le format adéquat est <table border="1" height="00"><tr><td></td></tr></table>

Ton echo personnellement ne sert à rien puisque le code qui va etre généré est fait lors du chargement de la page et non la génération .



15 Février 2008 13:20:48

ok bon si je comprends bien ce que je veux faire est impossible, mais je tente un dernier truc :

si je mets ce code alors que la div qui s'appelle "hauteur" est déclarée plus haut, c'est normal que ça me retourne "0" ?

  1. $variable='<script language="Javascript">
  2. var message=document.getElementById("hauteur").offsetHeight;
  3. document.write(message);
  4. </script>';
  5. echo $variable;
15 Février 2008 13:32:34

pour info , le document.write fait la même chose que l'echo mais du coté client et non serveur.

Ne mélange pas les deux .
15 Février 2008 13:36:45

oui mais si j'enlève le echo $variable; il ne m'affiche plus rien
15 Février 2008 14:21:53

  1. <html>
  2. <head>
  3. <script language="Javascript">
  4. function display(){
  5. var message=document.getElementById("hauteur");
  6. window.alert(message.offsetHeight);
  7. }
  8. </script>
  9. </head>
  10. <body>
  11. <div id="hauteur" height="100"></div>
  12. <input type="button" onclick="javascript:display()"/>
  13. </body>
  14. </html>


Par contre j'ai toujours 0 qui est retourné.
15 Février 2008 14:38:34

chez moi ça marche. Quand je clique sur le bouton cela me donne la hauteur de ma colonne. Mais comment faire pour récupérer cette valeur dans mon code php ? ou au moins pour la mettre dans une case cachée de formulaire ?
15 Février 2008 14:48:01

Oui , parce que n'oublie pas une chose , au moment ou ta page est affichée , php n'intervient plus !
15 Février 2008 16:29:35

j'ai radicalement changé de méthode et tout fonctionne.
Merci pour ton aide et tes réponses.
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS