Positionnement des <TD>

2 pièce(s) jointe(s)

bonjour,

J'ai un probleme, je voudrais possitionner mon premier <td> au premier <th> des organes

maleureusement j'ai du mettre le <th> des organes dans une page_header et le reste sur la page (car je fais une generation de pdf avec html2pdf) donc mes <th>organes ne se centre pas avec mon tableau du a mes <th>noms

explication en image

ce que j'ai
Pièce jointe 191307

et ce que je voudrais avoir
Pièce jointe 191308

avec un margin ce n' ai pas possible car j ai une serie de noms et d organe different

mais si il y a un moyen de faire un positionnement par exemple "position premier <td>= position premier <th>(organe) ca serait parfait

voici mon code source sans le php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<style type="text/css">
    table{ width:100%; }
  
    .table-header-rotated{
        text-align: right;
        width: auto;
        height: 15px;
        font-size:10px;
        padding-right:0px;
        margin: auto;
    }
  
    .table-header-rotated td {
        text-align:center;
        background-color:#DAE7F4;
        width:20px;
     
    }
     
    .table-header-rotated th > div {
        text-align:center;
    }
 
    .ColorOrg{
    width: 20px;
    text-align:center;
    line-height:0px;
    color:blue;
    rotate:90;
    }
    .numBdP{
display:table-cell;
    }
     
    .Info{
    display:table-cell;
    text-align: right;
    }
     
    page_footer{
    color:red;
    }
 
.container {
display: table-cell;
width:100%; }
     
     
 h1{
text-align:center;
 } 
     
     table.page_footer {width: 100%; border: none;  border-bottom: solid 1mm #AAAADD; padding: 2mm}
     table.page_header {width: 100%; border: none; border-top: solid 1mm #AAAADD; padding: 2mm}
  
</style>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<page backtop="70mm" backleft="10mm" backright="10mm" backbottom="30mm">
<page_header backtop="20mm" backleft="10mm" backright="10mm" backbottom="30mm">
 
 
 <table class="page_header">
            <tr>
                <td style="width: 50%; text-align: left">
                    <img src="images/logogroup_EN_full-color.jpg" width=300px; float=left;/>
                </td>
                <td style="width: 50%; text-align: right">
                  28/10/15                </td>
            </tr>
            <tr>
 
  <td style=width:100%;><h1>National delegation : Belgium (Interparliamentary delegations) </h1></td></tr>
 </table>
 <table class=table-header-rotated><tr>
 
    <th></th><th><div class=colorOrg>DAND</div></th><th><div class=colorOrg>DANZ</div></th><th><div class=colorOrg>DCAM</div></th><th><div class=colorOrg>DACP</div></th><th><div class=colorOrg>DLAT</div></th><th><div class=colorOrg>DEPA</div></th><th><div class=colorOrg>DMED</div></th><th><div class=colorOrg>D-IN</div></th><th><div class=colorOrg>DNAT</div></th><th><div class=colorOrg>DPAP</div></th><th><div class=colorOrg>D-CN</div></th><th><div class=colorOrg>D-US</div></th></tr></table>
  </page_header>
    <page_footer backtop="20mm" backleft="10mm" backright="10mm" backbottom="30mm">
 
        <table class="page_footer">
            <tr>
                <td style="width: 50%; text-align: left">
                    page [[page_cu]]/[[page_nb]]
                </td>
                <td style="width: 50%; text-align: right">
                Document generated by MepsRoles 2.5.4
                </td>
            </tr>
        </table>
    </page_footer>
 
 
<table class=table-header-rotated><tr><th>ARIMONT Pascal</th><td></td><td>S</td><td>M</td><td></td><td>M</td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr><tr><th>BELET Ivo</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td>M</td><td>S</td><td></td><td></td><td>S</td></tr><tr><th>ROLIN Claude</th><td></td><td></td><td></td><td>M</td><td></td><td></td><td></td><td></td><td></td><td>M</td><td></td><td></td></tr><tr><th>VANDENKENDELAERE Tom</th><td>S</td><td></td><td></td><td></td><td>S</td><td></td><td></td><td></td><td></td><td></td><td>M</td><td></td></tr>  </table>
 
</page>

merci d avance pour vos reponse

Bonjour,

Citation:

probleme de pissitionnement...

C'est sûrement une cystite. :aie:

ahhahhaha

désolé hein :D

est ce que vous avez une reponse a mon sujet par hasard ou bien est ce que vous connaissez une sorte de API pour le possitionnement en html2pdf

car je suis vraiment bloqué la je ne sais vraiment pas du tout comment proceder

ou peut si il y a moyen de mettre mes <th organe> dans la page et qu'il puissent a chaque fois ce repeter sur les autre pages ca serait coool aussi

merci

Les 2 tables doivent avoir les même dimensions et mêm nombre de colonnes.

Code:

<th></th>

Ne laisse pas le 1er th vide, et donne lui la même largeur que le th-nom.

merci mais la j ai un soucis comment puis-je savoir la largeur de mon th nom quand j ai plusieurs nom different de differente largeur ???

ou bien il y a pas un methode plus facile genre sans mettre mes td organe en page_header , avoir une sorte de marqueur qui permet de distinguer l element en question pour qu il puisse etre sur plusieurs page

Il faut imposer la largeur des colonnes (en %, px, ou cm puisque c'est pour un PDF)

ok mais il ne sera jamais mis comme je veux sur la premiere <td>

je suis entraine d effectuer les tests mais ca fonctionne pas ...

cela fonctionne pas :(

Bonjour,

Essaie ce script par hasard :

Code:

1
2
3
4
5
 var tableaux = document.getElementsByClassName("table-header-rotated");
    var tableauDuHaut = tableaux[0].getElementsByTagName("TH");
    var tableauDuBas = tableaux[1].getElementsByTagName("TH");
 
tableauDuHaut[0].style.width=tableauDuBas[0].offsetWidth + "px";

Citation:

Envoyé par djoufouf

cela fonctionne pas :(

Ça nous fait une belle jambe... :roll:

Ce n'est pourtant pas sorcier d'imposer des dimensions, si ?