Widht: 100% non pris sur mon tableau - Page 1

1

Le 15/05/2013 à 17:35

Bonjour,
j'ai tout simplement une table dont il m'est impossible de changer la largeur.
Différents tableaux de différentes taille sont générés et j'aimerais qu'ils prennent pour chacun d'entre eu la meme largeur sur ma page.
Je met dont un width:100% sur le tableau et laisse les tr et td sans aucun width.. tout se cale magnifiquement sur tous les navigateurs mais sur mon pdf la taille du tableau est comme en auto et tout est resserré.
J'ai testé meme en définissant le width : X px;
Mais rien à faire!

J'ai lu ici qu'il fallait spécifier les width de chacun des éléments.
topics/133388-table-does-not-work-with-100-width

Autrement dit, vu que mes tableaux sont de colonnes variables, ca veut dire que je suis foutu?? J'ai du mal à le croire... Il est possible qu'une image vienne à la place du tableau, et j'ai un keynuRes img width:100% qui fonctionne tres bien.

Si une personne a une solution je suis urgemment preneur!!
voici le code:

<div class="blocindic">
    <span class="keynum"></span>
    <div class="keynuRes">
        <table cellspacing="0" cellpadding="0" class="tabKeyNum"> 
            <tbody>
                <tr>
                    td...
                </tr>
                <tr>
                    td...
                </tr>
                <tr>
                    td...
                </tr>
            </tbody>
        </table>
    </div>
    <div id="source_key">
                        <span id="titre_source">Sources</span>
                        <span id="texte_source">
                            Auteur : SIT@DEL 2
                            <br>
                            Année : 2012        
                            <br>
                            Thème : Permis de construire - DPC  
                            <br><br></span>
     </div>
</div>

et le CSS

ext-align: left; }

PS: j'ai la V 4.03.blocindic {
    display:block;
    float: left;
    margin-bottom: 50px;
    margin-top: 20px; 
    position:relative;
    width: 100%;
}
.keynum {
    clear: both;
    color: #333399;
    float: left;
    font-family: arial;
    font-size:14px;
    font-weight: bold;
    margin-left: 20px;
    width: auto;
}
.keynuRes {
    float: left;
    margin-left: 20px;
    text-align: justify;
    width: 66%;
}
.tabKeyNum {
    width: 100%;
}
#source_key {
    display: block;
    float: left;
    color:#333333;
    width: 33%;
    position: absolute;
    bottom:0px;
    right:0px;
    t

Merci beaucoup

2

Le 22/05/2013 à 20:04

Il faut des width partout, table, td.

Les données proviennent d'où ?

J'ai rencontré un peu le même problème, et retravaille les tableaux pour les "nettoyer" et ensuite remettre les informations dont j'ai besoin.

Exemple:

 <!DOCTYPE html>
<html>
<head>
<title>Nettoyeur de tableau</title>

 <style>
.fondjaune th {
background-color:lightgreen;
font-family:trebuchet ms;}

.fondjaune td {
text-align:center;
font-family:trebuchet ms;}

</style>

</head>
<?php 

echo "Le tableau à adapter :<br>";
echo $haystack = '<br><table border="1" cellpadding="2" cellspacing="0" style="width:250px">
	<tbody>
		<tr>
			<td>&nbsp;</td>
			<td>En-tête</td>
		</tr>
		<tr>
			<td>Ligne 1</td>
			<td>contenu</td>
		</tr>
		<tr>
			<td>Ligne 2</td>
			<td>chiffres : &nbsp;123</td>
		</tr>
	</tbody>
</table>';
echo "<textarea rows='15' cols='60'>" . $haystack . "</textarea>";

$haystack = str_replace('"','\'',$haystack); //remplacer les " par des ''

$haystack = preg_replace('/<th/', '<td', $haystack); // remplacer les th par des td
$haystack = preg_replace('/\/th>/', '/td>', $haystack);
$haystack = preg_replace('/<td[^><]*>/','<td>',$haystack); // supprimer tous les styles etc dans les td's 
$haystack = preg_replace('/<tr[^><]*>/','<tr>',$haystack); // supprimer tous les styles etc dans le tr's
//NB s'il y a des balises à l'intérieur des td et tr's, ils ne seront pas supprimés

//compter le nombre de lignes et cellules pour calculer le nombre de colonnes:
$r = substr_count($haystack,"<tr");
$c = substr_count($haystack,"<td");
$cols= $c/$r;

$haystack = preg_replace('/\s\s+/', ' ', $haystack); // supprime les espaces en excès (mais laisse les espaces simples)

$larg = "150mm"; //définition de la largeur du tableau
$larg_premier = "style='width:" . "40mm'"; //définition de la largeur de la première colonne.  Ca peut-être obtenu avec un "explode" etc. depuis le tableau d'origine.
$larg_autres = "style='width:" . ($larg - $larg_premier)/($cols) . "mm;'"; //calcul de la largeur des autres colonnes;
$haystack = preg_replace('/<td/', '<th ' . $larg_premier . '', $haystack,$cols); //remettre des th sur les colonnes avec la valeur de largeur de colonne
$haystack = preg_replace('/\/td>/', '/th>', $haystack,$cols);

$haystack = preg_replace('/<td>/','<td ' . $larg_autres . ' >', $haystack,($c-$cols)); //affecter la largeur pour les td's

$tablestyle = "<table  border='1' cellpadding='2' class='fondjaune' style='width:" . $larg . ";'>"; //définir le style etc du tableau
$haystack = preg_replace('/<table[^><]*>/' ,$tablestyle , $haystack,1);  //l'injecter

echo "<br>Le tableau après adaptation :<br>";
echo $haystack;
echo "<textarea rows='15' cols='60'>" . $haystack . "</textarea>";

?>

</body>
</html>

html2pdf 4.03

3

Le 23/05/2013 à 12:25

Ha!! Merci Guppy!!

J'ai testé de mettre des wdth partout (table, tbody, tr et td) mais pour le moment ca n'a pas fonctionné.
Mes données viennent d'une requette SQL (postgre) et je les mets dans un tableaux qui s'affiche sur mon site. tout fonctionne tres bien sur rendu html mais des que ca mouline dans htmltopdf ca bugue.

je vais me pencher sur ton code mais en le survolant j'ai vu que tu as calculé le nombre de colonne. De mon coté les tableaux se forment sur mon site qui fonctionne sans le nombre de colonne donc. En meme temps je concatene le resultat html et le renvoie sur la page htmltopdf.
Il doit y avoir un moyen de mettre des width, notamment avec les % et auto sans devoir calculer ce nombre de col non?
Car je ne vois pas où le mettre, il faudrait que je renvoie dans ma chaine de texte, mon nombre de colonne pour chacun des tableaux, le récupérer et .... tout un bordel pour moi..

4

Le 23/05/2013 à 13:29

Si j'ai bien compris le nombre de colonnes est constant ? Ca simplifierait encore plus.
Je stocke les tableaux dans un champ MySQL et l'importe pour faire les PDFs.
Si tu mets les width's en mm partout, il n'y pas de raison que ça ne fonctionne? Il ne faut aucun "%".
Tu peux bien stocker le tableau dans une variable et la retravailler comme je le fais ?
Ce "retravail" pourra aussi servir pour le HTML et pas seulement pour l'affichage sur les PDFs.

html2pdf 4.03

5

Le 23/05/2013 à 14:17

je me suis mal exprimé, il y a bien un nombre de colonne variable.
mais le css sur l'affichage du site suffit pour que les colonnes prennent toute la place existante sans pour autant calculer le nombre de colonnes.
Je vais regarder du coup, mais le pbm c'est qu'en mettant des mm il faut connaitre le nombre de variable.

Il faut donc le stocker dans la bdd, ok. Mais le nombre de mm pour les colonne variera suivant si le tableau s'affiche dans la page web ou dans le pdf donc (vu que l'affichage et la largeur de la page est différent).