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 : footer qui ne prend pas toute la largeur


Sujet :

Dimensionnement en CSS

  1. #1
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2023
    Messages
    5
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Janvier 2023
    Messages : 5
    Points : 3
    Points
    3
    Par défaut CSS : footer qui ne prend pas toute la largeur
    Bonjour,
    Je rencontre des difficultés lors de la création de mon site pour un projet université.
    Le footer de mon site ne prend pas toute la largeur de l'écran.
    Je lui ai pourtant appliqué une largeur de 100% (sachant que mon body a des marges nulles et pas de largeur définie)
    Grosso modo dans mon CSS j'ai ça :

    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
    *{
    margin 0;
    padding 0;
    box-sizing:border-box;
    font-family:arial;
    }
     
    footer{
    margin 0;
    padding 50px;
    background-color:black;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-around;
    width:100%;
    }
    Si quelqu'un peut m'aider je suis preneur ! (je suis amateur en dev web)
    Merci et bonne soirée

  2. #2
    Modérateur
    Avatar de ProgElecT
    Homme Profil pro
    Retraité
    Inscrit en
    Décembre 2004
    Messages
    6 067
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Retraité
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Décembre 2004
    Messages : 6 067
    Points : 17 152
    Points
    17 152
    Par défaut
    Salut


    Il faut ajouter : entre la propriété et la valeur que tu lui donnes, donnez aussi l’unité à cette valeur.
    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
    *{
    margin: 0px;
    padding: 0px;
    box-sizing:border-box;
    font-family:arial;
    }
    *
    footer{
    margin: 0px;
    padding: 50px;
    background-color:black;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-around;
    width:100%;
    }
    Soyez sympa, pensez -y
    Balises[CODE]...[/CODE]
    Balises[CODE=NomDuLangage]...[/CODE] quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Balises[C]...[/C] code intégré dans une phrase.
    Balises[C=NomDuLangage]...[/C] code intégré dans une phrase quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Le bouton en fin de discussion, quand vous avez obtenu l'aide attendue.
    ......... et pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.
    👉 → → Ma page perso sur DVP ← ← 👈

  3. #3
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    Janvier 2023
    Messages
    5
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Janvier 2023
    Messages : 5
    Points : 3
    Points
    3
    Par défaut
    Fait mais le problème persiste...

  4. #4
    Modérateur
    Avatar de ProgElecT
    Homme Profil pro
    Retraité
    Inscrit en
    Décembre 2004
    Messages
    6 067
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Retraité
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Décembre 2004
    Messages : 6 067
    Points : 17 152
    Points
    17 152
    Par défaut
    Salut

    Peut être en ajoutant (si non déjà fait)
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    Soyez sympa, pensez -y
    Balises[CODE]...[/CODE]
    Balises[CODE=NomDuLangage]...[/CODE] quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Balises[C]...[/C] code intégré dans une phrase.
    Balises[C=NomDuLangage]...[/C] code intégré dans une phrase quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Le bouton en fin de discussion, quand vous avez obtenu l'aide attendue.
    ......... et pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.
    👉 → → Ma page perso sur DVP ← ← 👈

  5. #5
    Membre habitué Avatar de two3d
    Homme Profil pro
    Développeur Web
    Inscrit en
    Novembre 2012
    Messages
    126
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Tarn (Midi Pyrénées)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Novembre 2012
    Messages : 126
    Points : 168
    Points
    168
    Par défaut
    Si <footer> est dans une div, t'aura beau dire width:100% à <footer>, ce sera 100% de la div parente qui elle peut être, ne prend pas toute la largeur (voir avec l'inspecteur du navigateur pour aider)

    Sans HTML, on peut pas savoir ici

  6. #6
    Membre du Club
    Homme Profil pro
    IDE
    Inscrit en
    Janvier 2015
    Messages
    39
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Loire (Rhône Alpes)

    Informations professionnelles :
    Activité : IDE

    Informations forums :
    Inscription : Janvier 2015
    Messages : 39
    Points : 58
    Points
    58
    Par défaut Les valeurs nulles n'ont pas besoin d'unités.
    La dernière réponse est la bonne. Par contre, pour les réponses précédentes : les valeurs nulles n'ont pas besoin d'unités (sauf dans de rares cas, pour des propriétés CSS très spécifiques ; par exemple, line-height se comportera différemment).

Discussions similaires

  1. Modale qui ne prend pas tout l'écran
    Par d3LTa7 dans le forum Mise en page CSS
    Réponses: 5
    Dernier message: 23/08/2021, 10h34
  2. Un DIV qui ne prend pas toute la hauteur du body (100%)
    Par amateurprg dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 25/10/2019, 16h10
  3. ListView qui ne prend pas toute la place qu'il faut.
    Par ABandApart dans le forum Composants graphiques
    Réponses: 6
    Dernier message: 23/07/2011, 20h52
  4. Un JPanel qui ne prend pas toute ma JFrame
    Par Bartimeus dans le forum Agents de placement/Fenêtres
    Réponses: 2
    Dernier message: 26/01/2010, 22h47
  5. Div qui ne prend pas toute la largeur
    Par kidseb dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 12/09/2008, 20h18

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