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

Mise en page CSS Discussion :

cadre extensible avec image


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2002
    Messages
    616
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2002
    Messages : 616
    Par défaut cadre extensible avec image
    Bonjour

    mon probleme avec le code qui suit est qu'à l'affichage, j'ai un espace de 10px entre le 1er et le 2eme <tr>

    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
     
    <table border="0" width="100%" cellspacing="0" cellpadding="0">
        <tr>
            <td style="background-image:url(images/arrondi_haut_gauche.png); background-repeat:no-repeat">&nbsp;</td>
            <td style="background-image:url(images/haut_gris.png); background-repeat:repeat-x">&nbsp;</td>
            <td style="background-image:url(images/arrondi_haut_droite.png); background-repeat:no-repeat">&nbsp;</td>
        </tr>
        <tr>
            <td width="6px" style="background-image:url(images/gauche_gris.png); background-repeat:repeat;">&nbsp;</td>
            <td>&nbsp;</td>
            <td width="6px" style="background-image:url(images/droite_gris.png); background-repeat:repeat">&nbsp;</td>
        </tr>
        <tr>
            <td style="background-image:url(images/arrondi_bas_gauche.png); background-repeat:no-repeat">&nbsp;</td>
            <td style="background-image:url(images/bas_gris.png); background-repeat:repeat-x">&nbsp;</td>
            <td style="background-image:url(images/arrondi_bas_droite.png); background-repeat:no-repeat">&nbsp;</td>
        </tr>
    </table>
    merci de votre aide

  2. #2
    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
    Bonsoir, ce n'est très probablement pas un espace entre les tr mais un background mal placé.
    Une page en ligne faciliterait les chose (puisque ça vient peut-être d'une image), en l'état il est impossible de te dire d'où vient ce décalage.

  3. #3
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2002
    Messages
    616
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2002
    Messages : 616
    Par défaut
    je ne pense pas car en remplacant le 1er <tr>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
        <tr>
            <td style="background-image:url(images/arrondi_haut_gauche.png); background-repeat:no-repeat">&nbsp;</td>
            <td style="background-image:url(images/haut_gris.png); background-repeat:repeat-x">&nbsp;</td>
            <td style="background-image:url(images/arrondi_haut_droite.png); background-repeat:no-repeat">&nbsp;</td>
        </tr>
    par
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <tr><td colspan="3"></td></tr>
    j'ai toujours 12px de height en trop sur ce <tr>

    ps : les images font 6px x 6px

  4. #4
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2002
    Messages
    616
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2002
    Messages : 616
    Par défaut
    resolu :

    avec le code suivant :
    test ie7 et ff ok

    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
            <tr>
                <td width="6px" height="6px" style="background-image:url(images/arrondi_haut_gauche.png); background-repeat:no-repeat; background-position:bottom;"></td>
                <td width="100%" style="background-image:url(images/haut_gris.png);background-repeat:repeat-x; background-position:bottom;"></td>
                <td width="6px" height="6px"  style="background-image:url(images/arrondi_haut_droite.png); background-repeat:no-repeat; background-position:bottom;"></td>
            </tr>
            <tr>
                <td style="background-image:url(images/gauche_gris.png); background-repeat:repeat-y">&nbsp;</td>
                <td>&nbsp;</td>
                <td width="6px" style="background-image:url(images/droite_gris.png); background-repeat:repeat-y">&nbsp;</td>
            </tr>
            <tr>
                <td style="background-image:url(images/arrondi_bas_gauche.png); background-repeat:no-repeat">&nbsp;</td>
                <td style="background-image:url(images/bas_gris.png); background-repeat:repeat-x">&nbsp;</td>
                <td style="background-image:url(images/arrondi_bas_droite.png); background-repeat:no-repeat">&nbsp;</td>
            </tr>

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

Discussions similaires

  1. cadre extensible avec image
    Par nicerico dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 11/06/2009, 20h39
  2. Réponses: 1
    Dernier message: 27/08/2007, 14h07
  3. [XI] Cadre avec images
    Par poweremu dans le forum SAP Crystal Reports
    Réponses: 4
    Dernier message: 13/03/2007, 00h23
  4. [CSS] Problème avec cadre sur une image lien
    Par Strix dans le forum Mise en page CSS
    Réponses: 7
    Dernier message: 24/12/2006, 10h09
  5. Cadres avec image comme encadrement
    Par Nibor dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 11/12/2006, 19h57

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