Répondre à la discussion
Affichage des résultats 1 à 2 sur 2

Avis sur code XHTML/CSS



  1. #1
    Elbuey76

    Avis sur code XHTML/CSS


    ------

    Bonjour à tous,

    je poste içi mon code xhtml/css afin que vous puissiez me donner votre avis, je l'ai tester sur le navigateur Dreamweaver (IE et Firefox), il marche...
    Le problème est que dans la fenetre d'affichage "création" de dreamweaver, il ne s'affiche pas du tout comme sur le navigateur, toutes les images sont chamboulées.
    Je voulais savoir si cela été important étant donné qu'en pratique, mon site fonctionne comme je le veux.
    Je voulais savoir aussi si il avait des modifications à apporter sur une chose que j'aurais mal faite.

    Pour vous faciliter la compréhension: les div "haut" "gauche" "droite" ect... sont des div auxquel j'ai mis une image de fond et que jai positionné comme un mini puzzle afin d'obtenir au final une seul image (qui sera la page d'accueil) et sur laquel il y a 2 bouton "entrer" et "sortir".

    Voila merci d'avance pour vos réponses. Cordialement.



    Le code XHTML:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Document sans nom</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link href="communs.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    .Style2 {font-size: 14px}
    .Style3 {color: #B5FE52}
    .Style4 {color: #858585}
    .Style5 {color: #c0f76b}
    body {
    	background-color: #FFFFFF;
    }
    -->
    </style>
    </head>
    
    <body>
    <div class="conteneur">
            <div class="haut"></div>
            <div class="gauche"></div>
            <div class="milieu1"></div>
    		<div class="milieu2"></div>
    		<div class="milieu3"></div>
            <div class="droite"></div>
            <div class="bouton1"><a href="home.htm" class="bouton1"></a></div>
    		<div class="bouton2"><a href="www.google.fr" class="bouton2"></a></a></div>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p align="center">&nbsp; </p>
            <p align="center"><span class="Style2"><span class="Style3"><span class="Style5">Powered by Julien PARENT</span> |</span> <a href="mailto:babyshambles76@hotmail.fr" class="Style4">babyshambles76@hotmail.fr</a></span></p>
    </div>    
    </body>
    </html>
    Le code CSS:

    Code:
    /* CSS Document */
    .conteneur {
        margin: 0 auto;
    	height: 600px;
    	width: 600px;
    	}
    .haut {
        position: absolute;
        height: 236px;
    	width: 600px;
    	margin-left: 0px;
    	margin-top: 0px;
    	background: url(images/haut.jpg) no-repeat left bottom ;
    	}
    
    .gauche {
        position: absolute;
    	height: 308px;
    	width: 364px;
    	margin-left: 0px;
    	margin-top: 236px;
    background: url(images/gauche.jpg) no-repeat left bottom ;
    	}
    .milieu1 {
        position: absolute;
    	height: 279px;
    	width: 84px;
    	margin-top: 265px;
    	margin-left: 364px;
    	background: url(images/milieu1.jpg) no-repeat left bottom ;
    	}
    .milieu2 {
        position: absolute;
    	height: 308px;
    	width: 19px;
    	margin-top: 236px;
    	margin-left: 448px;
    	background: url(images/milieu2.jpg) no-repeat left bottom ;
    	}
    .milieu3 {
        position: absolute;
    	height: 279px;
    	width: 84px;
    	margin-top: 265px;
    	margin-left: 467px;
    	background: url(images/milieu3.jpg) no-repeat left bottom ;
    	}
    .droite {
        position: absolute;
    	height: 308px;
    	width: 49px;
    	margin-left: 551px;
    	margin-top: 236px;
    	background: url(images/droite.jpg) no-repeat left bottom ;
    	}
    	a.bouton1 {
        position: absolute;
    	height: 29px;
    	width: 84px;
    	margin-left: 364px;
    	margin-top: 236px;
    	background: url(images/bouton1.jpg) no-repeat left bottom ;
    	}
    
    a.bouton1:hover {
    background: url(images/bouton1vert.jpg) no-repeat left bottom ;}
    a.bouton2 {
        position: absolute;
    	height: 29px;
    	width: 84px;
    	margin-left: 467px;
    	margin-top: 236px;
    	background: url(images/bouton2.jpg) no-repeat left bottom ;
    	}
    a.bouton2:hover {
    background: url(images/bouton2vert.jpg) no-repeat left bottom ;
    
    }

    -----

  2. #2
    Rock!N-$qu@T

    Re : Avis sur code XHTML/CSS

    Bonjour,

    Voila déjà ce que tu peux faire pour vérifier les erreurs de code :
    CSS-Validator

    Ca permet de tester ton code CSS et XHTML. Tu va pouvoir optimiser ton code comme cela.

    Bonne journée.
    Avant, le luxe était d'être connecté à internet...Bientôt, le luxe sera de ne plus l'être

Discussions similaires

  1. tutoriaux XHTML et CSS
    Par Big Boy dans le forum Internet - Réseau - Sécurité générale
    Réponses: 4
    Dernier message: 01/07/2007, 09h31
  2. mise en gras titres menu en XHTML
    Par Big Boy dans le forum Internet - Réseau - Sécurité générale
    Réponses: 6
    Dernier message: 15/06/2007, 07h53
  3. Critique sur premier code css/html
    Par kenboi dans le forum Internet - Réseau - Sécurité générale
    Réponses: 1
    Dernier message: 27/08/2005, 06h48
  4. problème sur HTML et CSS
    Par etudes_05 dans le forum Logiciel - Software - Open Source
    Réponses: 0
    Dernier message: 18/03/2005, 19h05
  5. XHTML strict
    Par Jedeki dans le forum Internet - Réseau - Sécurité générale
    Réponses: 9
    Dernier message: 13/12/2004, 09h42
Découvrez nos comparatifs produits sur l'informatique et les technologies.