IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

<td> avec height et background (IE - Firefox) [XHTML 1.0]


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé Avatar de mdr_cedrick
    Profil pro
    Développeur multimédia
    Inscrit en
    Janvier 2008
    Messages
    374
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Côte d'Or (Bourgogne)

    Informations professionnelles :
    Activité : Développeur multimédia

    Informations forums :
    Inscription : Janvier 2008
    Messages : 374
    Par défaut <td> avec height et background (IE - Firefox)
    Bonjour à tous
    j'ai un petit problème entre ie7 (ne fonctionne pas) et firefox (fonctionne)
    j'ai posté deux images pour vous montrer mon soucis
    et voici mon code
    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
    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
    	<tr>
    		<td style="background:url('img/haut_mini_g.jpg') no-repeat bottom right;"></td>
    		<td style="height:106px;background:url('img/banniere_c.png') repeat-x top;">
    			<table border="0" width="100%" cellspacing="0" cellpadding="0">
    			<tr>
    				<td style="width:447px;height:106px;">&nbsp;</td>
    				<td style="height:106px;">&nbsp;</td>
    				<td style="width:475px;height:106px;">&nbsp;</td>
    			</tr>
    			</table>
    		</td>
    		<td style="background:url('img/haut_mini_d.jpg') no-repeat bottom left;"></td>
    	</tr>
    	<tr>
    		<td style="width:27px;height:50%;">
    			<table border="0" cellspacing="0" cellpadding="0" style="height:100%;width:100%;">
    			<tr>
    				<td style="background:url('img/haut_g.jpg') no-repeat right;height:36px;">&nbsp;</td>
    			</tr>
    			<tr>
    				<td style="background:url('img/centre_g.jpg') repeat-y right;">&nbsp;</td>
    			</tr>
    			</table>
    		</td>
    		<td rowspan="2">
    			<table border="0" cellspacing="0" cellpadding="0">
    			<tr>
    				<td colspan="3" style="background:url('img/haut_c.jpg') repeat-x;height:36px;"></td>
    			</tr>
    			<tr>
    				<td style="width:289px;background:#ffffff;">
    				<?php
    				if (isset($_SESSION["messageErreur"]) && $_SESSION["messageErreur"] != '')
    				{
    					echo '<center><font style="color:#573102;font-weight:bold;">'.$_SESSION["messageErreur"].'</font></center>';
    					unset($_SESSION["messageErreur"]);
    				}
    				include('_inc/menu_g.php');
    				?>
    				</td>
    				<td style="width:100%;padding:15px 15px 15px 15px;background:url(img/visuel.jpg) no-repeat top right #ffffff;min-height:355px;" id="centre">
    					<?php echo $ewp->flush(); ?>
    				</td>
    				<td style="background:#ffffff;">
    					<?php include('_inc/menu_d.php'); ?>
    				</td>
    			</tr>
    			<tr>
    				<td colspan="3" style="background:url('img/bas_c.jpg') repeat-x top; height:58px;">
    					<div id="bas"></div>
    				</td>
    			</tr>
    			</table>
    		</td>
    		<td style="width:27px;height:50%;">
    			<table border="0" cellspacing="0" cellpadding="0" style="height:100%;width:100%;">
    			<tr>
    				<td style="background:url('img/haut_d.jpg') no-repeat left top;height:36px;">&nbsp;</td>
    			</tr>
    			<tr>
    				<td style="background:url('img/centre_d.jpg') repeat-y left;height:100%;">&nbsp;</td>
    			</tr>
    			</table>
    		</td>
    	</tr>
    	
    	<tr>
    		<td style="width:27px; height:50%;">
    			<table border="0" cellspacing="0" cellpadding="0" style="height:100%;width:100%;">
    			<tr>
    				<td style="background:url('img/centre_g.jpg') repeat-y right;">&nbsp;</td>
    			</tr>
    			<tr>
    				<td style="background:url('img/bas_g.jpg') no-repeat top right;height:58px;">&nbsp;</td>
    			</tr>
    			</table>
    		</td>
    		<td style="width:27px; height:50%;">
    			<table border="0" cellspacing="0" cellpadding="0" style="height:100%;width:100%;">
    			<tr>
    				<td style="background:url('img/centre_d.jpg') repeat-y left;">&nbsp;</td>
    			</tr>
    			<tr>
    				<td style="background:url('img/bas_d.jpg') no-repeat;height:58px;">&nbsp;</td>
    			</tr>
    			</table>
    		</td>
    	</tr>
    	</table>
    je vous ai mis en rouge la partie qui bloque
    en fait l'image en background ne descend pas jusqu'où elle devrait dans IE7 (je n'ai pas testé le 6)
    j'ai testé un peu toutes les solutions de height (px, %, etc)
    mais rien à faire

    merci de votre aide
    Images attachées Images attachées   

  2. #2
    Membre chevronné
    Homme Profil pro
    Développeur informatique
    Inscrit en
    Janvier 2005
    Messages
    357
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 63
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur informatique
    Secteur : Conseil

    Informations forums :
    Inscription : Janvier 2005
    Messages : 357
    Par défaut
    Salut,
    Voilà encore une bonne raison pour abandonner l'utilisation de tableaux pour faire de la mise en page.
    Je te conseillerais plutôt d'utiliser une structure sémantique adaptée à ta page associée à une feuille de style. De cette manière tu allègeras ton code et le rendra plus facilement utilisable sur les différents navigateurs.

  3. #3
    Membre éclairé Avatar de mdr_cedrick
    Profil pro
    Développeur multimédia
    Inscrit en
    Janvier 2008
    Messages
    374
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Côte d'Or (Bourgogne)

    Informations professionnelles :
    Activité : Développeur multimédia

    Informations forums :
    Inscription : Janvier 2008
    Messages : 374
    Par défaut
    pour la structure principale, notre choix (avec mes collègues) s'est porté sur les tableaux, car nous voulons design qui s'adapte à la largeur de la page du client.
    Pour la largeur donc pas de soucis mais c'est la hauteur qui est mal gérée par IE7 le background

  4. #4
    Membre Expert Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Par défaut
    Citation Envoyé par mdr_cedrick Voir le message
    pour la structure principale, notre choix (avec mes collègues) s'est porté sur les tableaux, car nous voulons design qui s'adapte à la largeur de la page du client.
    Bonjour, l'utilisation du couple DIV/CSS le permet aussi et plus simplement que les tableaux qui eux, s'adaptent à leur contenus et non à la largeur de la zone d'affichage.
    Si tu souhaites quand même conserver ton tableau, une page en ligne ou au pire la TOTALITÉ du code HTML (et éventuellement CSS s'il y a) serait nécessaires.

  5. #5
    Membre éclairé Avatar de mdr_cedrick
    Profil pro
    Développeur multimédia
    Inscrit en
    Janvier 2008
    Messages
    374
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Côte d'Or (Bourgogne)

    Informations professionnelles :
    Activité : Développeur multimédia

    Informations forums :
    Inscription : Janvier 2008
    Messages : 374
    Par défaut
    du coup j'ai opté pour une autre solution, toujours avec tableaux mais structuré différemment. J'utilise une couleur de fond unie plutôt qu'une image en background qui doit se répéter et du coup je retombe sur ce que je voulais.

    Merci quand même de votre aide

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [XHTML] probleme avec <height="100%">, la huateur ne fonctionne pas
    Par pierrot10 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 07/08/2006, 20h14
  2. probleme avec height sous netscape!
    Par Death83 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 10
    Dernier message: 06/02/2006, 00h57
  3. Probleme avec div + css background-color
    Par shwin dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 11/01/2006, 00h14
  4. Probleme avec height sous IE.
    Par Death83 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 21/10/2005, 22h20
  5. [CSS] Bug IE avec height ne marche pas avec les %
    Par El Riiico dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 23/06/2005, 17h11

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo