Bonsoir,
aujourd'hui, je parviens à avoir cet alignement : http://vercorshandisport.org/schneider/test.html et le but serait d'obtenir celui-là : http://www2.schneider-electric.com/s.../site-map.page
Mon code est le suivant :avec ce css :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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 <table> <tbody> <tr> <!------1e colonne -----> <td style="vertical-align: top;"> <ul class="masquer-puce level1"> <li><span class="fond-grey lien">...</span></li> <li>...</li> etc <li> <ul class="masquer-puce level2 bullet"> ... <ul class="masquer-puce level3"> <li>...<li> etc </ul> </ul> </li> </ul> </td> <!------2e colonne -----> <td style="vertical-align: top;"> <ul class="masquer-puce colonne-level1"> <li>... </li> etc </ul> </td> etc </tbody> </table>Une solution ne serait-elle pas d'abandonner les <table> et tout faire en <ul> ?
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14 @charset "utf-8"; .titleHeader{font-size:25px;font-family:Arial;padding:8px 10px 0 10px;height:40px;float:none;clear:both;color:#FFFFFF} .fond-grey{color:black;font-size: 20px;background-color:#C0C0C0;font-weight:bold;width:130px; } .fond-grey-pasbold{color:black;font-size: 20px;background-color:#C0C0C0;width:130px;} .width-td{margin-left:0px;margin-right:0px;} .level1{width:130px;margin-top:20px;margin-right:0px;} .level2{padding-left:0px;font-size: 15px;} .level3{padding-left:5px;font-size: 11px;} .lien-blue{color:blue;text-decoration:underline;} .lien{text-decoration:underline;} .vrai-lien{cursor:hand;} .masquer-puce{list-style-type:none;} .bullet { list-style-image: url('./images/green_bullet.gif');}
Avant d'essayer, j'aimerais avoir une confirmation.
Partager