Tableau HTML - Height = ""

Fermé
gaerebut Messages postés 1017 Date d'inscription mardi 30 octobre 2007 Statut Membre Dernière intervention 22 novembre 2013 - 24 sept. 2008 à 09:33
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 - 24 sept. 2008 à 11:39
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
A voir également:

10 réponses

papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 220
24 sept. 2008 à 09:36
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
papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 220
24 sept. 2008 à 09:39
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
gaerebut Messages postés 1017 Date d'inscription mardi 30 octobre 2007 Statut Membre Dernière intervention 22 novembre 2013 171
24 sept. 2008 à 09:52
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
papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 220
24 sept. 2008 à 09:55
Alors un div... sinon.. je passe la main :-D
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
gaerebut Messages postés 1017 Date d'inscription mardi 30 octobre 2007 Statut Membre Dernière intervention 22 novembre 2013 171
24 sept. 2008 à 10:18
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
papymucho Messages postés 140 Date d'inscription mercredi 18 juin 2008 Statut Membre Dernière intervention 1 novembre 2009 220
24 sept. 2008 à 10:41
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
gaerebut Messages postés 1017 Date d'inscription mardi 30 octobre 2007 Statut Membre Dernière intervention 22 novembre 2013 171
24 sept. 2008 à 10:52
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
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
24 sept. 2008 à 11:23
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
gaerebut Messages postés 1017 Date d'inscription mardi 30 octobre 2007 Statut Membre Dernière intervention 22 novembre 2013 171
24 sept. 2008 à 11:25
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
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
24 sept. 2008 à 11:39
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