css et html, ajout de caractére non désiré

Par flo3376, il y a 12 ans

Les bases HTML/CSS

bonjour à tous,
voilà je bosse sur mon site et je suis en train de nettoyer un peu mes div

exemple

<div style="background-image: url('./site/bootstrap/img/gps.png'); width:612px; height:335px;left: 383px;top: 202px;position: relative;" >...</div>

deviens 

<div class="module" >...</div>

et je modifie mon css en ajoutant 

.module
    { 
        background-image: url("./site/bootstrap/img/voyant.png");
        width: 850px;
        height: 117px;
        position: absolute;
        top: 195px;
        margin-left: auto;
        margin-right: auto;
    }

mais voilà le site me fait une bonne blague.

il rajoute des caractéres

copié coller d'une partie défaillante 

<div class="?"plaque_voyant"">?

        <div class="?"adm-alarme2"">?
    <span class="mp"><span>
    </div>    
</div>

les quote ne sont pas de moi je précise,
voici les codes

un des css 

<style type="text/css">
html, body, #map-canvas 
    {
        padding: 0 ;
        height: 700px;
    }

.acarcontainer
    {
        width: 100%; 
        height: 450px; 
        overflow: hidden; 
        position: relative; 
    }

.acarcontainer iframe
    { 
        width: 100%!important; 
        height: 100%!important; 
        position: absolute; 
        top: 0; 
        left: 0; 
    }
.afficheur 
    { background-color: black; 
        color:white;
        font: system;
    }

.progress 
    { 
        height: 10px; 
        margin-bottom: 20px; 
        overflow: hidden; 
        background-color: #f5f5f5; 
        border-radius: 4px; 
        -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); 
        box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); 
    }
.alarme 
    { 
        float:left;
    }

::-webkit-scrollbar {width: 3px;}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -webkit-border-radius: 3px;border-radius: 3px;}
::-webkit-scrollbar-thumb {webkit-border-radius: 3px; border-radius: 3px;background: #008000; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.5);}
::-webkit-scrollbar-thumb:window-inactive {background: #008000; }
.plaque_voyant
    { 
        background-image: url("./site/bootstrap/img/voyant.png");
        width: 850px;
        height: 117px;
        position: absolute;
        top: 195px;
        margin-left: auto;
        margin-right: auto;
    }
.adm-alarme2 
    { 
        width: 790px;
        height: 81px;
        background-color: #000;
        border-radius: 10px;
        position: absolute;
        top: 0px;
        margin-left: auto;
        margin-right: auto;
    }
.voy_off { text-decoration: none;background-color: #2F332E;color: #1A1D26;border-radius: 5px;padding: 6px;margin: 4px;float:left;}
.voy_bleu { text-decoration: none;background-color: #5EB6DD;color: #046380;border-radius: 5px;padding: 6px;margin: 4px;float:left; }
.voy_vert { text-decoration: none;background-color: #02710D;color: #00A511;border-radius: 5px;padding: 6px;margin: 4px;float:left; }
.voy_rouge { text-decoration: none;background-color: #590000;color: #AE2525;border-radius: 5px;padding: 6px;margin: 4px;float: left; }
.voy_orange { text-decoration: none;background-color: #8A390A;color: #FE5E01;border-radius: 5px;padding: 6px;margin: 4px;float:left; }
</style>

le fichier en cours de réécriture 

<div class="col-lg-12">
    <div class=?"plaque_voyant">?
        <?php 
        /////gestion des alarmes lumineuse////
        include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/source/alarme_voyant.php'); 
        include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/source/alarme_voyant_gest.php'); 
        ?>
    </div>
    <div style="background-image: url('./site/bootstrap/img/gps.png'); width:612px; height:335px;left: 383px;top: 202px;position: relative;" >
        <iframe scrolling="no" frameborder="no" src="http://www.fsopen.co.uk/maps/index2.php?HostID=7240" style="width: 511px;height: 297px;left: 51px;top: 19px;position: relative;"> </iframe>
    </div>
    <div style="background-image: url('./site/bootstrap/img/gps2.png'); width: 800px; height: 335px;left: 333px;top: 266px;position: relative;" >
        <iframe scrolling="auto" frameborder="no" src="http://www.fsopen.co.uk/gwt/shared/playersonline/?HostID=7240" style="width: 698px;height: 297px;left: 51px;top: 19px;position: relative;"> </iframe>
    </div>
    <div style="background-image: url('./site/bootstrap/img/ecran_m.png'); width: 392px;height: 392px;position: absolute;top: 319px;left: 0px;">
        <div id="mumble" style="position: absolute;top: 25px;left: 51px;overflow: auto;width: 290px;height: 333px;;"></div>
        <?php include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/mumble/mumble_js.php'); ?>
    </div>
    <div style="background-image: url('./site/bootstrap/img/db_pan.png'); width: 342px;height: 265px;position: absolute;top: 718px;left: 0px;">
        <span class="serveur" style="position: absolute;top: 25px;left: 67px;"><img src="./config/image/ajax-loader.gif"></span>
        <?php include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/dynamique_modules/follow_session_js.php'); ?>

        <span style="position: absolute;top: 130px;left: 65px;">
        <h5><font color="green">Mumble canal:</font></h5>
        <h6><font color="green">
            SRV:<BR>srv08.serveurmumble.com<BR>
            PORT: 50698<BR>
            Password: pegase</font>
        </h6>
    </div>
    <?php include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/mumble/mumble_js.php'); ?>          

        <BR>
</div>

et je fichier principal index.php 

<?php
/////vérifiaction de la protection active page appelante/////
if(!defined('PROTECTIONINCLUDE')){die('Accès Interdit');}
/////activation protection page appelé/////
define('PROTECTIONINCLUDE', TRUE);
/////insertion des base de donnée/////
include './config/bdall.php';

//////////////////////////////////////////////////
//$mp =$user->data'user_unread_privmsg'];
$pilote = $user->data'username'];
$lastc= $user->data'user_lastvisit'];
if ($mp!=0){$message=1;} else {$message=0;}
$avatar=$user->data'user_avatar'];
$base_avatar="./forum/download/file.php?avatar";
$img_avatar=$base_avatar.'='.$avatar;
$idf=$user->data'user_id'];
$ses_id=$user->session_id;

?>
<!DOCTYPE html>
<html>
    <head>
        <title>FFS2 V5.00/membre</title>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
        <!-- Google Map-->
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
        <!-- JQuery -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>  
        <!-- JQuery VALIDATE -->
        <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>  
        <!-- Latest Bootstrap compiled and minified CSS -->
        <link rel="stylesheet" href="./site/bootstrap/css/bootstrap.css">
        <link rel="stylesheet" href="./site/bootstrap/css/session.css">

        <!-- Latest Bootstrap compiled and minified JavaScript -->
        <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
        <!-- Zoom box -->
        <script type="text/javascript" src="./config/zoombox/zoombox.js"></script>
        <link href="./config/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
        <!-- JSchart -->
        <script type="text/javascript" src="./config/JScharts/sources/jscharts.js"></script>
        <!-- jsapi -->
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script>
    jQuery(function($){
        $('a.zoombox').zoombox({
                theme : 'zoombox', //available themes : zoombox,lightbox, prettyphoto, darkprettyphoto, simple
                opacity : 0.8, // Black overlay opacity
                duration : 800, // Animation duration
                animation : true, // Do we have to animate the box ?
                width : 600, // Default width
                height : 400, // Default height
                gallery : true, // Allow gallery thumb view
                autoplay : false // Autoplay for video
            });
        });
</script>   
    </head>
<body style="background-image: url('./site/bootstrap/img/test5.png');
background-repeat: no-repeat;
background-position: center;
background-position-y: 0px;">
<?php 
$mailf=$user->data'user_email'];
$id_f=$user->data'user_id'];
/////chargement des messages du haut////
include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/dynamique_modules/message_dyn.php');
 ?>
<div class="container">
    <div class="row">
        <div class="col-lg-12">
            <h1>Fs France Simulateur II V5.00</h1>
            <p>Le vol sans contrainte</p>
            <p class="skiplink"><a href="#start_here">Vers le contenu</a></p>
            <iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FFs-France-Simulateur-2%2F139138822925484&width&layout=button_count&action=like&show_faces=false&share=true&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px;position: absolute;left: 1000px;top: 50px;" allowtransparency="true"></iframe>
            <div class="clear"></div>

            <ul class="linklist navlinks">
                <!-- alarme session -->
                <div id="session_alarme"></div>
            </ul>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <span class="menu"><img src="./config/image/ajax-loader.gif"></span>
            <?php include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/dynamique_modules/menu_js.php'); ?>
        </div>
    </div>
    <div class="row">
        <?php 
        /////gestion des pages////
        include ($_SERVER"DOCUMENT_ROOT"].'/config/dispatch.php'); 
        ?>
    </div>
</div>

<?php //include ($_SERVER"DOCUMENT_ROOT"].'/site/explore.php'); ?>
</body>
</html>

je ne comprend pas ce qu'il se passe, ai je comis encore une faute de débutant, ou ai je fais une manip éxotique.

pourriez vous me guider.

merci d'avance flo

3 réponses

Bahamut45, il y a 12 ans

Bonjour,

Ton problème vient de la :

<div class=?"plaque_voyant">?
        <?php 
        /////gestion des alarmes lumineuse////
        include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/source/alarme_voyant.php'); 
        include ($_SERVER"DOCUMENT_ROOT"].'/site/membre/include/alarme_js/source/alarme_voyant_gest.php'); 
        ?>
    </div>

Les points d’interrogation ne doivent pas être la.

Cordialement

flo3376, il y a 12 ans

je me suis mal expliqué,
ce que tu viens de citer c'est chrome qui me le crache
en fouillant un peu il s'agit en réalité du symbol ​ "ESPACE SANS CHASSE" que chrome reçois
j'ai trouvé cet article mais mon anglais est largué

ça parle de HTML5 et de son doctype et d'un éventuel soucis avec sublime text que j'utilise,
article

si quelqu'un peu m'aider à comprendre

flo3376, il y a 12 ans

Problème résolue,
bien qu'étrange il semblerait que mon problème venais de mon ordinateur qui avait besoin de redémarrer.
après redémarrage de la machine j'ai réouvert mes fichiers dans sublime, forcer le réencodage en UFT8 sans boom et tout est revenue à la normal ou presque.

Es ce que quelqu'un à déjà eu le soucis??