Tableau HTML - Height = ""

gaerebut Messages postés 1060 Statut Membre -  
PhP Messages postés 1774 Statut Membre -
Bonjour,

J'essaye depuis maintenant plusieurs heure (c'est un peu hyperbolisé mais c'est pour dire que j'y est passé du temps ^^) de définir une hauteur maximum a un tableau en HTML ou ce tableau est dynamique, en vain. Quand je dis dynamique, c'est qu'il affichera le contenu d'une base de données et donc cela créera une nouvelle à chaque fois !

Est-il possible de mettre une scrollbar a ce tableau a partir d'une taille limite ????

J'ai essayé <table style="max-height: 20%"> ou aussi l'attribue overflow: auto et hidden mais rien n'y fait ! :(

S'il vous plait c'est urgent ! Je dois présenter ce projets vendredi devant des patrons ! :s

LOL la haine !

A+

Gaerebut
--
Il y a 2 règles d'or pour réussir dans la vie :
-Règle 1:  ne jamais dire tout ce que l'on sait...
-Règle 2: ...
Configuration: Windows Vista
Firefox 3.0.1

10 réponses

  1. papymucho Messages postés 146 Statut Membre 220
     
    Salut,

    Dans ce cas, ce serait pas plutôt un min-height? ^^

    Oups, edit : je dis des conneries lol..... je m'en vais relire ce message
    0
  2. papymucho Messages postés 146 Statut Membre 220
     
    https://www.commentcamarche.net/contents/494-frames-html

    Une petite frame?

    Edit à nouveau.... Une scroll-bar sur un tableau, à ma connaissance je ne pense pas, maintenant si c'est possible j'aimerais bien savoir comment aussi par curiosité :)

    En revanche, tu peux peut-être contourner le problème, soit en passant par une frame dans laquelle tu mettrais ton tableau, soit par un div avec un height défini, caché au préalable par exemple, et si son remplissage nécessite une action de l'utilisateur, s'affichant à celle-ci, se remplissant, une scroll-bar serait créé automatiquement...

    Voilà, ça ne résoud pas exactement le problème certes ;-)
    0
  3. gaerebut Messages postés 1060 Statut Membre 171
     
    Non c'est démodé ça maintenant les frames ^^

    En plus que je me trouve déjà dans une iframe donc ... ça va faire très petit ! Surtout (et oui il y a beaucoup de contrainte) que cette iframe n'est que le contenu d'un contenant ! Autrement dis, tu va sur http://www.havre-port.fr/ et tu vois que la partie du milieux n'est pas vraiment grosse, et ben c'est une appli qui s'y intègrera donc .... pas gros ^^

    A+

    Gaerebut
    0
  4. papymucho Messages postés 146 Statut Membre 220
     
    Alors un div... sinon.. je passe la main :-D
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. gaerebut Messages postés 1060 Statut Membre 171
     
    lol

    Désolé j'ai déjà tout essayé ! Même avec un div !! :(

    je met quoi dans le div ? Pareil ?

    Si c'est ça, ça marche pas :'(

    lol

    A+

    Gaerebut
    0
  7. papymucho Messages postés 146 Statut Membre 220
     
    Tu mets ton tableau...

    Dans ton css, du défini un heigth:100px sur ton div par exemple..... Quand ton tableau se remplira, la scrollbar va apparaitre dans ton div....

    C'est étonnant que ça ne marche pas... j'ai fait un datepicker récemment, avec l'apparation d'un div lors d'un click sur une image.... avant de pouvoir définir une bonne hauteur j'ai fait quelques tests, quand la hauteur était insuffisante par rapport au nombre de lignes du tableau, une scrollbar apparaissait.... me permettant de parcourir mon tableau...

    Une bonne journée, bye.
    0
  8. gaerebut Messages postés 1060 Statut Membre 171
     
    Ok, ça marche toujours pas ... lol

    Il y a une scrollbar pour la iframe entière et non juste pour la div ! Bizarre comme tu dis, moi aussi j'ai eu le reflexe de height, min-height, max-height, tableau et div mais ça marche pas dans ce cas là ! Bizzare bizzare !

    J'ai aussi déjà utilisé des div a scrollbar ou des tableau mais là ... je sèche ! ^_^'

    mais j'ai réussi a me débrouiller autrement tanpis ...
    Puis tout façon, c'est pour un menu d'administration donc .... ça gènera que les admins XD

    A+

    Gaerebut
    0
  9. PhP Messages postés 1774 Statut Membre 606
     
    Bjr

    Avec un div tout bête je ferais comme ceci :

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html  xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <style>
    .container
    {
    	position : absolute;
    	left : 100px;
    	top : 150px;
    	width : 300px;
    	height : 100px;
    	overflow : auto;
    	border-style : solid;
    	border-width : 1px;
    	border-color : #ff0000;
    }
    
    td
    {
    	white-space: nowrap;
    	border-style : solid;
    	border-width : 1px;
    	border-color : #1010a0;
    }
    
    table
    {
    	border-collapse : collapse;
    }
    </style>
    </head>
    <body>
    Test tableau
    <div class="container">
    	<table border="0" cellspacing="0" cellpadding="3">
    		<tr>
    			<td>Demo ligne 1-1</td>
    			<td>Demo ligne 1-2</td>
    			<td>Demo ligne 1-3</td>
    		</tr>
    	
    		<tr>
    			<td>Demo ligne 2-1</td>
    			<td>Demo ligne 2-2</td>
    			<td>Demo ligne 2-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 3-1</td>
    			<td>Demo ligne 3-2</td>
    			<td>Demo ligne 3-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 4-1</td>
    			<td>Demo ligne 4-2</td>
    			<td>Demo ligne 4-3</td>
    		</tr>
    	
    		<tr>
    			<td>Demo ligne 5-1</td>
    			<td>Demo ligne 5-2</td>
    			<td>Demo ligne 5-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 6-1</td>
    			<td>Demo ligne 6-2</td>
    			<td>Demo ligne 6-3</td>
    		</tr>		
    		
    	</table>
    </div>
    </body>
    


    PhP  
    Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...
    0
  10. gaerebut Messages postés 1060 Statut Membre 171
     
    Merci beaucoup à toi mais moi aussi j'ai fait pareil ...

    Mais ça doit venir du fait que je suis dans un iframe et que j'utilise la librairie Window.js (qui utilise des iframe)

    Mais oui je suis d'accord que ça marche comme ça normalement !

    Mais pas là :(

    J'ai fait autrement ^^

    A+ et merci encore à vous

    Gaerebut
    0
  11. PhP Messages postés 1774 Statut Membre 606
     
    Ben avec une iframe même combat : ok sour IE7 et FF

    tableau_iframe.htm :

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html  xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <style>
    .container
    {
    	position : absolute;
    	left : 100px;
    	top : 150px;
    	width : 300px;
    	height : 100px;
    	overflow : auto;
    	border-style : solid;
    	border-width : 1px;
    	border-color : #ff0000;
    
    }
    </style>
    </head>
    <body>
    Test tableau
    <iframe class="container" src="tableau.htm" ></iframe>
    </body>


    tableau.htm

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html  xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <style>
    body
    {
    	margin : 0px;
    	padding : 0px;
    }	
    
    
    td
    {
    	white-space: nowrap;
    	border-style : solid;
    	border-width : 1px;
    	border-color : #1010a0;
    }
    
    table
    {
    	border-collapse : collapse;
    }
    </style>
    </head>
    <body>
    <table border="0" cellspacing="0" cellpadding="3">
    		<tr>
    			<td>Demo ligne 1-1</td>
    			<td>Demo ligne 1-2</td>
    			<td>Demo ligne 1-3</td>
    		</tr>
    	
    		<tr>
    			<td>Demo ligne 2-1</td>
    			<td>Demo ligne 2-2</td>
    			<td>Demo ligne 2-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 3-1</td>
    			<td>Demo ligne 3-2</td>
    			<td>Demo ligne 3-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 4-1</td>
    			<td>Demo ligne 4-2</td>
    			<td>Demo ligne 4-3</td>
    		</tr>
    	
    		<tr>
    			<td>Demo ligne 5-1</td>
    			<td>Demo ligne 5-2</td>
    			<td>Demo ligne 5-3</td>
    		</tr>
    		
    		<tr>
    			<td>Demo ligne 6-1</td>
    			<td>Demo ligne 6-2</td>
    			<td>Demo ligne 6-3</td>
    		</tr>		
    		
    	</table>
    </body>


    A mon avis ta librairie window.js = grosse daube !
    0