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 :

positionement div pas le même sous firefox et explorer


Sujet :

Positionnement en CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Homme Profil pro
    Inscrit en
    Octobre 2004
    Messages
    514
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 58
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2004
    Messages : 514
    Par défaut positionement div pas le même sous firefox et explorer
    bonjour débutant dans le css j'aimerais avoir l'aide d'un expert sur ce point, suivant le navigateur utiliser le design css change et j'aurais aimé qu'il reste pareile seriez vous m'aidé svp a comprendre et a modifier ce code .Un grand merci.

    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
     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <style TYPE="text/css">
    BODY {
    scrollbar-3dlight-color: #FFFFFF;
    scrollbar-arrow-color: #D3E6FF;
    scrollbar-base-color: #3D58A5;
    scrollbar-face-color: #395294;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-shadow-color: #FFFFFF;
    }
    #haut {
    	position: absolute;
    	background:#fff000;
    	width: 794px;
    	height:96px;
    	border:1px dashed #000;
    	padding: 0px;
    	left: 8px;
    	top:10px;
       }     
     
    #gauche {
    	position: absolute; 
    	width: 150px;
    	height: 400px;
    	border:3px solid #000;
    	left: 8px;
    	top: 110px;
       }
    #frame {
    	position: absolute; 
    	width: 150px;
    	height: 400px;
    	overflow: auto; /* cette propriété va permettre le scroll de ce bloc */
    	border:3px solid #000;
    	left: 652px;
    	top: 110px;
    }  
    #center {
    	position: absolute;
    	background:#fff000;
    	width: 477px;
    	height:400px;
    	overflow: auto; /* cette propriété va permettre le scroll de ce bloc */
    	border:1px dashed #000;
    	padding: 0px;
    	left: 165px;
    	top: 110px;
       }
    #bas {
    	position: absolute;
    	background:#fff000;
    	width: 794px;
    	height:30px;
    	border:1px dashed #000;
    	padding: 0px;
    	left: 8px;
    	top:515px;
       }     
     
    //--></style>
    </head>
    <body>
    <div id="haut">haut</div>
    <div id="gauche">gauche</div>
    <div id="center"> hella</div>
    <div id="frame"> laaaaaa</div>
    <div id="bas">bas</div>
    </body>
    </html>

  2. #2
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Tout d'abord, enlever :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    BODY {
    scrollbar-3dlight-color: #FFFFFF;
    scrollbar-arrow-color: #D3E6FF;
    scrollbar-base-color: #3D58A5;
    scrollbar-face-color: #395294;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-shadow-color: #FFFFFF;
    }
    Et puis tout en position absolute .... pourquoi pas hein.

    Rajoute au début de ton code CSS, on ne sait jamais :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    *{
       margin:0;
       padding:0;
    }
    De plus, mets le DOCTYPE complet :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">

  3. #3
    Membre éclairé
    Homme Profil pro
    Inscrit en
    Octobre 2004
    Messages
    514
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 58
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2004
    Messages : 514
    Par défaut
    sorry je début la dedans et je encore de grosse lacune en css car je debut ci-cela est bon dis le moi et les autre chose a changer, j'aurais aimé mettre le cadre centrale faire des arrondi au coin auriez vous une idée svp???

  4. #4
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Les coins arrondis en CSS ne fonctionnent qu'avec Firefox.

    Ou alors tu fais des images.

  5. #5
    Membre éclairé
    Homme Profil pro
    Inscrit en
    Octobre 2004
    Messages
    514
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 58
    Localisation : Belgique

    Informations forums :
    Inscription : Octobre 2004
    Messages : 514
    Par défaut
    Merci de tes réponse cela est sympa aussi non en générale mon code est bon en générale stp???

  6. #6
    Membre Expert
    Avatar de trotters213
    Profil pro
    Inscrit en
    Janvier 2005
    Messages
    2 571
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : France, Gard (Languedoc Roussillon)

    Informations forums :
    Inscription : Janvier 2005
    Messages : 2 571
    Par défaut

    je ne suis un expert en CSS ni HTML mais j'ai 2 ou 3 trucs :
    mettre les balises et attributs en minuscules
    respecter les standards
    fermer une balise ouverte (même les br : <br />)
    indenter son code (c'est pas indispensable mais ça rend le code plus lsisible)
    séparer la forme du contenu (donc utiliser des CSS plutôt que de mettre les styles dans le code HTML)

    Pour vérifier si ton code est bon (syntaxiquement par contre sémantiquement c'est à toi de le voir) tu peux le faire sur le validateur HTML du W3C pour le code HTML et sur le validateur CSS du W3C pour les feuilles de styles CSS.

Discussions similaires

  1. Notepad++ n'exécute pas le code sous Firefox
    Par gesalz dans le forum Débuter
    Réponses: 3
    Dernier message: 01/02/2008, 17h21
  2. Div absolute mais relative sous FireFox
    Par jambonstar dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 01/02/2008, 11h58
  3. Pas de CSS sous firefox
    Par jejesochalion dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 31/12/2006, 18h05
  4. Pas d'affichage sous Firefox
    Par bouchette63 dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 27/06/2006, 09h13
  5. [XSL] Pas d'affichage sous firefox
    Par bouchette63 dans le forum XSL/XSLT/XPATH
    Réponses: 4
    Dernier message: 17/05/2006, 14h54

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