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 :

Problème avec doctype : pas les mêmes dimensions en css avec ou sans doctype


Sujet :

Dimensionnement en CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Étudiant
    Inscrit en
    Avril 2007
    Messages
    34
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2007
    Messages : 34
    Par défaut Problème avec doctype : pas les mêmes dimensions en css avec ou sans doctype
    Bonjour,

    Je souhaitais adapter une image pour qu'elle occupe 100% de la page.
    Tout marchait, mais quand j'ajoute le doctype, l'image est plus grande que la fenêtre.

    Pour que vous puissiez visualiser :

    Lien sans doctype

    Lien avec doctype (J'ai activé la scroolbar pour que vous voyez bien la différence)

    Merci d'avance

  2. #2
    Modérateur
    Avatar de blueice
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mars 2003
    Messages
    3 494
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 50
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2003
    Messages : 3 494
    Par défaut
    Le lien avec DOCTYPE ne fonctionne pas et de toute manière un document DOIT avoir un DOCTYPE, donc refait le site en prenant en compte le DOCTYPE...

  3. #3
    Membre averti
    Profil pro
    Étudiant
    Inscrit en
    Avril 2007
    Messages
    34
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2007
    Messages : 34
    Par défaut
    Merci de ta réponse,

    Mon lien marche. Mais si je refais le site avec le doctype, il y aura les mêmes comportements, non ?
    Si tu veux je te donne mon code css et tu me dis ce que t'en pense...
    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
    <style type="text/css">
    <!--
    body {
     
    	background-image: url(images/fonts/bienvenue2.png);
    	margin-left: 0px;
    	margin-top: 0px;
    	margin-right: 0px;
    	margin-bottom: 0px;
    }
    .Style3 {font-size: 12px}
    .Style5 {color: #000000}
     
     
    #photo {
        width: 100%;
        height: 100%;
     
    }
     
    #Layer1 {
    	position:absolute;
    	width: 100%;
    	height:28px;
    	left : 0%;
    	top: 88%;
    	z-index: 1;
    }
    #Layer2 {
    	position:absolute;
    	width: 100%;
    	height:28px;
    	left : 0%;
    	top: 95%;
    	z-index: 2;
    	}
     
    -->
    </style>
    Donc #photo c'est la photo qui doit prendre la taille de la fenêtre et les layers ce sont les cadres de texte.


    Merci d'avance

  4. #4
    Membre averti
    Profil pro
    Étudiant
    Inscrit en
    Avril 2007
    Messages
    34
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2007
    Messages : 34
    Par défaut
    Bonjour,

    En fait, je remarque que l'attribut height de #photo n'est pas pris en compte, il prend une valeur Auto je pense. Pourquoi ?

    Merci

  5. #5
    Modérateur
    Avatar de blueice
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mars 2003
    Messages
    3 494
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 50
    Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2003
    Messages : 3 494
    Par défaut
    Rajoute la ligne *{...} et modifie le body comme donné...
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    * { margin:0; padding:0; }
    body {background-image: url(images/fonts/bienvenue2.png); }

  6. #6
    Membre averti
    Profil pro
    Étudiant
    Inscrit en
    Avril 2007
    Messages
    34
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Avril 2007
    Messages : 34
    Par défaut
    Merci beaucoup, c'est déjà mieux, il n'y a plus de fond qui dépasse
    Si tu veux voir

    Par contre l'attribut height de #photo est toujours ignoré... Je me demande pourquoi.

    Si tu veux voir mon fichier entier : bienvenue2.html
    Fichiers attachés Fichiers attachés

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

Discussions similaires

  1. Réponses: 1
    Dernier message: 05/06/2009, 17h29
  2. Réponses: 1
    Dernier message: 10/03/2009, 22h54
  3. Réponses: 4
    Dernier message: 18/11/2008, 21h33
  4. Problème de Variables ayant les mêmes adresses
    Par danathane dans le forum Débuter
    Réponses: 2
    Dernier message: 09/06/2008, 08h02
  5. Réponses: 4
    Dernier message: 17/01/2008, 07h36

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