[HTML] Redimensionnement d'une page

**julrock** · 31/05/2008, 20h26

Bonjour,
Je suis en train de me créer une page web perso et j'ai quelques petits problèmes lors du redimensionnement de ma page.

Photoshop ma créer un tableau HTML et à inséré toutes mes slices dans mes cellules de tableau.

Le problème est que lorsque je redimensionne ma page, j'aimerais que le contenu reste toujours centrer et que ce soit les bordures de ma page qui s'agrandissent.

Y'a t-il une fonction php ou javascrip qui pourait me permettre de faire cela?
Suis-je obligé d'utiliser des div?
Peut-être existe t-il une façon plus simple de procédé?

Merci

**htr999** · 31/05/2008, 23h07

pourrais-tu expliciter ton code ?.?

**julrock** · 31/05/2008, 23h25

Code :

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
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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
 
<html>
<head>
<title>CP_Sliced</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- ImageReady Slices (CP_Sliced.psd) -->
<table id="Tableau_01" width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td rowspan="8" style="background-image: url(images/image-design/bordure-gauche.jpg);">
 
        <td colspan="11" style="background-image: url(images/image-design/bordure-haut.jpg);">
 
        <td rowspan="8" style="background-image: url(images/image-design/bordure-droit.jpg);">
 
        <td>
            <img src="images/spacer.gif" width="1" height="52" alt=""></td>
    </tr>
    <tr>
        <td rowspan="6">
            <img src="images/image-design/bordure-gauche-contour.jpg" width="16" height="679" alt=""></td>
        <td colspan="9">
            <img src="images/image-design/logo.jpg" width="773" height="177" alt=""></td>
        <td rowspan="6">
            <img src="images/image-design/bordure-droit-contour.jpg" width="15" height="679" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="177" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/image-design/bordure-avant-menu.jpg" width="51" height="36" alt=""></td>
        <td colspan="2">
            <div><img src="images/image-design/menu-accueil.jpg" width="168" height="36" alt=""></div></td>
        <td colspan="2">
            <img src="images/image-design/menu-quiNousSommes.jpg" width="168" height="36" alt=""></td>
        <td>
            <img src="images/image-design/menu-produitService.jpg" width="167" height="36" alt=""></td>
        <td colspan="2">
            <img src="images/image-design/menu-nousJoindre.jpg" width="168" height="36" alt=""></td>
        <td>
            <img src="images/image-design/bordure-apres-menu.jpg" width="51" height="36" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="36" alt=""></td>
    </tr>
    <tr>
        <td colspan="2">
            <img src="images/image-design/coin-hautGauche-contenu.jpg" width="52" height="35" alt=""></td>
        <td colspan="2">
            <img src="images/image-design/pageTitre-accueil.jpg" width="184" height="35" alt=""></td>
        <td colspan="3">
            <img src="images/image-design/pageTitre-apres.jpg" width="410" height="35" alt=""></td>
        <td colspan="2">
            <img src="images/image-design/langage.jpg" width="127" height="35" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="35" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="3">
            <img src="images/image-design/bordure-gauche-contenu.jpg" width="52" height="431" alt=""></td>
        <td colspan="5" rowspan="2" style="background-image: url(images/image-design/contenu.jpg);">
        insert la page web ici
            </td>
        <td colspan="2">
            <img src="images/image-design/bordure-droit-contenu.jpg" width="127" height="284" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="284" alt=""></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">
            <img src="images/image-design/logo-ebb.jpg" width="127" height="147" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="81" alt=""></td>
    </tr>
    <tr>
        <td colspan="5">
            <img src="images/image-design/contenu-bas.jpg" width="594" height="66" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="66" alt=""></td>
    </tr>
    <tr>
        <td colspan="11" style="background-image: url(images/image-design/bordure-bas.jpg);></td>
        <td>
            <img src="images/spacer.gif" width="1" height="37" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/spacer.gif" width="131" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="16" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="51" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="1" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="167" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="17" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="151" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="167" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="92" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="76" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="51" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="15" height="1" alt=""></td>
        <td>
            <img src="images/spacer.gif" width="89" height="1" alt=""></td>
        <td></td>
    </tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

**4R416N33** · 01/06/2008, 18h58

Qu'est ce que tu cherches à redimensionner ?

Qu'est ce que tu veux qui reste à la même place ?

**julrock** · 01/06/2008, 19h53

Je voudrais que ce soit la premiere balise <TR>(celle avec bordure) qui s'agrandisse et un peu plus bas, la balise qui contient ma avec la bordure-bas.jpg

le reste j'aimerais qu'il reste toujours centrer

**htr999** · 01/06/2008, 20h30

pas compris !!!
sinon dans ton code, la 2eme <tr> en partant du bas, il te manque une fermeture " pour style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<tr>
        <td colspan="11" style="background-image: url(images/image-design/bordure-bas.jpg);"></td>
        <td>
            <img src="images/spacer.gif" width="1" height="37" alt=""></td>
    </tr>

si tu pourrais donner en P.J le code et les Imgs...

**julrock** · 01/06/2008, 20h42

je voudrai que ce soit ces cellules ci qui se redimensionne:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<tr>
        <td rowspan="8" style="background-image: url(images/image-design/bordure-gauche.jpg);">
 
        <td colspan="11" style="background-image: url(images/image-design/bordure-haut.jpg);">
 
        <td rowspan="8" style="background-image: url(images/image-design/bordure-droit.jpg);">
 
        <td>
            <img src="images/spacer.gif" width="1" height="52" alt=""></td>
    </tr>

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<tr>
        <td colspan="11" style="background-image: url(images/image-design/bordure-bas.jpg);"></td>
        <td>
            <img src="images/spacer.gif" width="1" height="37" alt=""></td>
    </tr>

voici le site en P.J

**julrock** · 03/06/2008, 18h50

est-que je pourrais avec une petite piste?

serais-je mieux d'utilisé des divs

[HTML] Redimensionnement d'une page

HTML

Discussions similaires

Partager

Partager