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 :

[CSS] width-height


Sujet :

CSS

  1. #1
    Membre éprouvé
    Avatar de Anduriel
    Homme Profil pro
    Ingénieur intégration
    Inscrit en
    Février 2004
    Messages
    2 290
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur intégration

    Informations forums :
    Inscription : Février 2004
    Messages : 2 290
    Par défaut [CSS] width-height
    Salut,

    Je veux que mon lien (et ainsi son background) fasse toute la largeur d'un div, faisant 144px.
    J'ai fait:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    a.menu {
    	color: gray;
    	text-decoration: none;
    	width: 144px;
    	background: white;
    	height: 25px;
    }
    Le problème c'est que width (et height) ne sont pas pris en compte le background s'adapte au texte
    Comment faire?
    Merci

  2. #2
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    bonsoir,

    visiblement sous FF, on ne peut pas définir la longueur d'un lien contrairement à IE.
    Même avec un span ça ne marche pas. Le seul moyen est d'encadrer ta balise <a> d'un paragraphe et d'y appliquer les styles ci-dessus :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <p class="menu"><a href="#">mon lien</a></p>
    et p :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    menu {
       color: gray;
       text-decoration: none;
       width: 144px;
       background: white;
       height: 25px;
       margin: 0px; 
       padding: 0px;
    }

  3. #3
    Membre éprouvé
    Avatar de Anduriel
    Homme Profil pro
    Ingénieur intégration
    Inscrit en
    Février 2004
    Messages
    2 290
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur intégration

    Informations forums :
    Inscription : Février 2004
    Messages : 2 290
    Par défaut
    Mais pourquoi avec:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    p.lien {
    	color: gray;
    	background: white;
    	width: 137px;
    	padding: 3px;
    	border-color: #C6C6C6;
    }
    Mon background prend ben toute la longueur (137px) mais pas la bordure qui se met autour de texte?

  4. #4
    Membre éprouvé
    Avatar de Anduriel
    Homme Profil pro
    Ingénieur intégration
    Inscrit en
    Février 2004
    Messages
    2 290
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur intégration

    Informations forums :
    Inscription : Février 2004
    Messages : 2 290
    Par défaut
    Je ne comprends pas je suis sous IE les width devraient fonctionner...

  5. #5
    Membre chevronné
    Avatar de ilood
    Inscrit en
    Mars 2005
    Messages
    468
    Détails du profil
    Informations forums :
    Inscription : Mars 2005
    Messages : 468
    Par défaut
    Bonjour

    D'après les normes du w3c, une balise de type inline (a, span, etc.) ne peut pas être redimensionnée avec width ou height.
    Seules les balises de type bloc (div, p, h1, etc.) sont redimensionnables.

    Si tu veux définir une largeur à un lien, tu dois lui appliquer, grâce au css, un comportement de type block.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    a {
    display: block;
    width: 144px;
    }

Discussions similaires

  1. [CSS] - Contenu height fixe
    Par vdumont dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 25/09/2006, 03h00
  2. [css] width: auto + display: inline
    Par gorgonite dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 10/06/2006, 20h15
  3. css div height
    Par mauroyb0 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 16/05/2006, 09h10
  4. [CSS]width:100% avecmargin/padding/border ?
    Par Raay dans le forum Mise en page CSS
    Réponses: 14
    Dernier message: 03/11/2005, 15h15
  5. [css]opéra height 100% absolute
    Par spirou dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 08/10/2005, 22h10

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