5568 sujets

Sémantique web et HTML

Problème de validation des tables

Pages :
Bonjour à tous,

Donc voilà, j'ai un petit problème.
Ayant cherché pendant quelques heures rien trouver à ce sujet, je viens m'adresser à vous pour obtenir de l'aide si possible.

Mon problème:

Je passe ma page à la validation sur le site officiel de w3c, et hop il me renvoi une erreur au niveau des tables.

Donc, je voudrais savoir si les tables ne sont plus valides au normes de la w3c et si c'est le cas par quoi pourrais-je remplacé s'il vous plait.

En espérant trouver de l'aide
Cordialement DjaSama.
Modifié par DjaSama (15 Nov 2009 - 11:28)
Salut,

Les tableaux sont tout à fait valides même en xhtml strict, il faut juste qu'ils soient correctement codés. Peut-être qu'avec un peu de code on pourrait t'aider à trouver les erreurs que tu as pu commettre. Smiley cligne
Voilà, je met le code html comme demandé et je met également le code qui contient la template des news comme j'utilise cutenews...


Code de la page (x)html :



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
 
		<!-- Type de contenu et charset -->
		 <meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />

		<!-- Informations de page -->
		 <title> Naruto Référence - Votre source d'information sur le manga Naruto et Naruto Shippuuden de Masashi Kishimoto !" </title>
		
		<!-- Metas Générales -->
		 <meta name="description" content="Naruto Référence est un site de fans consacré à l'actualités, news du manga Naruto et Naruto Shippuuden de Masashi Kishimoto" />
		 <meta name="subject" content="Naruto et Naruto Shippuuden" />
		 <meta name="keywords" content="mkteam,mkt,m k team,mk-team,m-k-team,naruto,episode,generique,dossiers,manga,anime,personnages,nrt,film,serie,tv,naruto-reference,video,musique,naruto,sakura,sasuke,kakashi,akatsuki,kyuubi,chapitre,pain,minato,scans,scanlation,scantrad,techniques,jutsu" />
		 <meta name="author" content="Naruto Référence" />
		 <meta name="language" content="fr" />
		 <meta name="copyright" content="Copyright © 2006-2009 Naruto Référence" />
		 <meta name="reply-to" content="support_mkt@hotmail.fr" />

		 <!-- Metas Complexes -->
		 <meta name="identifier-url" content="http://www.naruto-reference.com" />
		 <meta name="category" content="actualités" />
		 <meta name="distribution" content="global" />
		 <meta name="revisit-after" content="1 days" />
		 <meta name="robots" content="Index, follow" />
		 <meta http-equiv="refresh" content="600" />
		 
		 <!-- RSS -->
		 <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://www.naruto-reference.com/cutenews/rss.php" />

		 <!-- Feuilles de style -->
		 <link href="template/style.css" rel="stylesheet" type="text/css" />
		 
		 <!-- Favicon -->
		 <link rel="shortcut icon" href="http://www.naruto-reference.com/images/favicon.ico" />
		 
		 
	</head>
	<body>

	    <!-- HEADER - Debut de la balise header qui contient le header -->
	     <div id="header">
				
				<div class="cadre">
				
				
				
				</div>
		 </div>
		<!-- HEADER - Fin de la balise header qui contient le header -->
		
		<!-- INFORMATION - Debut de la balise information qui contient les informations -->
		 <div id="information">
				
				<div class="stats">
				
				<span class="orange" style="font-size: 11px; font-family: Myriad Pro;">» S</span>tatistiques<br /><br />
				
				 <?php
					include('/home/mangasrt/www/compteur_visite/counter.php');
					echo "Visiteurs : $c_alltime <br />";
					echo "Aujourd'hui : $c_today <br />";
					echo "En ligne : $c_online";
				 ?>
				</div>
				
				<div class="chapitre_inform">
				
				<a href="manga/chapitre_ddl.php" /><img src="template/images/lel.png" style="border:none;" alt="" /><br/>
				<a href="manga/chapitre_ddl.php" /><img src="template/images/telecharger.png" style="border:none;" alt="" />
				
				</div>
				
				
				
				<div class="spoils">
				
				</div>
				
				<div class="last_chap">
				
				<a href="manga/.php" /><img src="template/images/chapitres/chapitre_info/469.png" style="border:none;" alt="" />
				
				</div>
				
				<div class="last_episode">
				
				<a href="anime/.php" /><img src="template/images/episodes/episode_info/132.png" style="border:none;" alt="" />
				
				</div>
				
		 </div>
		<!-- INFORMATION - Fin de la balise information qui contient les informations -->
		
		<!-- CONTENU - Debut de la balise contenu qui contient le contenu du site -->
		 <div id="contenu">
		 
			
			
			<TABLE WIDTH=515 BORDER=0 CELLPADDING=2 CELLSPACING=0 height="106" style="border-collapse: collapse; margin-left: 113px; margin-top: -10px;" bordercolor="#111111" align="left">
	<TR>
		<TD>
			  
			     <?php 
				 
				 if($_GET['rub'] == "")
					
					include("/home/mangasrt/www/cutenews/show_news.php");
	
				 else
				 if(file_exists($_GET['rub'].'.php'))
	
				 include($_GET['rub'].'.php');
				 else include('404.php'); 
				 
				 ?>
				 
				 
			</TD>
	</TR>
</TABLE>
			
			<!-- MENU - Debut de la balise menu qui contient le menu droit du site -->
			
             <div id="menu">
				
		
			     <?php 
				     include('menu.php')
				 ?>
				 
				 
			 </div>
			 
			<!-- MENU - Fin de la balise menu qui contient le menu droit du site -->
			
			<!-- PARTENAIRE - Debut de la balise partenaire qui contient le bloc partenaire droit du site -->
			  
			 <div class="partenaires" style="padding-top: px">
			 
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_1.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_2.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_3.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_1.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_2.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_3.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_1.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_2.png" /><br><br>
			   <img src="http://m-k-team.com/images/partenariat/ban_88_31_3.png" /><br><br>
			   
			</div>
			<!-- PARTENAIRE - Fin de la balise partenaire qui contient le bloc partenaire droit du site -->
			 
			</div>
			<!-- CONTENU - Fin de la balise contenu qui contient le contenu du site -->
		
			<!-- FOOTER - Debut de la balise footer qui contient le footer du site -->
			 <div id="footer">
				
				
				 <p class="copy">
				 Copyright © 2006-2009 <span class="orange">Naruto Référence</span>. Tous les personnages presentés ici sont la propriété de leur auteurs<br> respectifs.
				 Design :<a href="http://m-k-team.com/"> N-Trad</a> Découpe et Intégration xHtml / CSS : <a href="http://m-k-team.com"> Dja-Sama </p> 
				
				
             </div>
			 
			<!-- FOOTER - Fin de la balise footer qui contient le footer du site -->
			
	</body>
</html>


Code de la template de news :



<style type="text/css">

<!--.lien {

	color: #FFFFFF;
}
.lien a {

	color: #efc068;
}

.lien a:hover{

	color: #ff9900;
}-->

</style>

<TABLE WIDTH=514 BORDER=0 CELLPADDING=2 CELLSPACING=0 height="" style="border-collapse: collapse" bordercolor="#111111" align=center>
	<TR>
		<TD>
			<div style="background-image: url(http://mangasrt.power-heberg.com/template/images/head_news.png); background-repeat: no-repeat; height: 117px; width: 514px;">
			
			
			<span  style="color: #FFFFFF; position: relative; top: 20px; left: 90px;"><b><h2>» {title}</h2> </b></span>
			<span class="lien" style="font-size: 12px; color: #FFFFFF; position: relative; top: 25px; left: 90px;">» News posté par {author} le {date}</span>
			<span  class="lien" style="font-size: 12px; color: #FFFFFF; position: relative; top: 42px; right: 190px;">» [com-link]Poster un commentaire[/com-link] ({comments-num})</span>
			
			</div>

		
			<div style="background-image: url(http://mangasrt.power-heberg.com/template/images/content_news.png); min-height: 118px; width: 514px;">
			
			
			<span  class"lien" style="width: 540px; font-size: 12px; color: #FFFFFF; position: relative; left: 10px; padding-left: px; padding-right: 18px;" >{short-story}
			
			
			</div>

            <div style="background-image: url(http://mangasrt.power-heberg.com/template/images/footer_news.png); background-repeat: no-repeat; height: 27px; width: 514px;">
			
			</div>
		</TD>
	</TR>
</TABLE>



Voilà,

Cordialement, DjaSama
Modifié par DjaSama (15 Nov 2009 - 13:29)
Merci beaucoup, !!

C'est bon ça marche quelques problèmes au niveau des floats que je n'arrive toujours pas à maitriser malgré les astuces donnés par Alsacréations, puis je voudrais savoir comme j'utilise un script pour écrire mes news, mais le problème c'est qu'il ne respecte pas les normes il ne referme pas certaine balise comme par exemple, "<br>" au lieu de "<br />".

Le script se nomme Cutenews, si vous avez une solution pour y remédier, n'hésitez pas à m'en faire part s'il vous plait.

Puis quand je passe ma page au validateur, voilà le message d'erreur qui intervient :



#  Error  Line 207, Column 8: XML Parsing Error: Opening and ending tag mismatch: div line 90 and body

	</body>

&#9993;
# Error Line 208, Column 7: XML Parsing Error: Opening and ending tag mismatch: body line 39 and html

</html>

&#9993;
# Error Line 208, Column 7: XML Parsing Error: Premature end of data in tag html line 2

</html>


Voilà, j'ai parfois jusqu'à 10 message d'erreur du même type... si vous pouvez m'aidez à ce problème, ce serait très gentil.

Edit : Voilà, j'ai tester un truc, en fait, j'ai rajouter une "</div>" avant le footer, puis j'ai valider ma page, et là, ma page est valide. Je suis bien content mais lorsque je regarde ma page, il se trouve quel est un peu déformer, il s'affiche apparement normalement sous ie mais sous firefox c'est la catastrophe Smiley confus ... donc, voilà je cherche jusqu'à qu'une âme charitable me propose sont aide.

Cordialement, DjaSama.
Modifié par DjaSama (15 Nov 2009 - 17:18)
Justement, dans une page XHTML, il suffit qu'il y ait un élément vide mal fermé (<br> au lieu de <br />) pour générer une cascade d'erreurs analogues à celles que tu cites.

Ce que tu peux faire, c'est effectuer un remplacement en PHP, comme dans l'exemple suivant :
$chaine = 'chaîne qui comporte des <br> problématiques';
$chaine_conforme = str_ireplace ('<br>', '<br />', $chaine);
echo $chaine_conforme;

Modifié par Victor BRITO (15 Nov 2009 - 19:22)
Ah oui, c'est vrai ça marche, mais le problème c'est que moi j'ai ça :



				 if($_GET['rub'] == "")
					
					include("/home/mangasrt/www/cutenews/show_news.php");
	
				 else
				 if(file_exists($_GET['rub'].'.php'))
	
				 include($_GET['rub'].'.php');
				 else include('404.php');


Donc voilà, vous devriez savoir ce que cela est Smiley cligne .

Ce mini-script, ou bout de code php, c'est ce qui génère le contenu ou les news du site, et c'est donc ce contenu qui contient des balises non valides que je voudrais remplacer mais la j'avoue je suis totalement perdu Smiley decu .

Comment puis-je faire svp ?

Cordialement, DjaSama
Dans ce cas on n'a pas le choix : il faut détourner la sortie en utilisant la teamporisation. C'est un peu moche, mais on ne peut pas faire autrement si le script inclus fait des echo


                 if($_GET['rub'] == "") {
ob_start();
include("/home/mangasrt/www/cutenews/show_news.php");      
$str = ob_get_contents();
ob_end_clean();
$str = str_replace('<br>', '<br />', $str);
echo $str;
}
Merci beaucoup,

Donc voilà, ça marche !!

Mais pour remplacé "<img src="url_image" alt="image" > par "<img src="url_image" alt="image" />,

comment faire ?

J'ai essayé en ajoutant cette ligne :




$str = str_replace('<img>', '<img/>', $str);


Mais cela ne marche pas, si vous avez une solution..

Cordialement, DjaSama
DjaSama a écrit :
J'ai essayé en ajoutant cette ligne :




$str = str_replace('<img>', '<img/>', $str);


Mais cela ne marche pas, si vous avez une solution..

Normal que ça ne marche pas. Le mieux, dans le cas des éléments img, est de passer par une expression rationnelle effectuant les remplacements à la fois pour br et img :
$str = preg_replace ('#<(br|img)(.*)>#iU', '<\1\2 />', $str);

Si jamais tu ne connais rien aux expressions rationnelles, je te conseille de parcourir ce tuto. Smiley cligne
Modifié par Victor BRITO (16 Nov 2009 - 09:04)
Voici un moyen qui va paraître un peu barbare... mais si tu ne comptes pas utiliser à terme les fonctionnalités d'un parser XML sur ton document, tu peux te contenter de rester en HTML strict. Ce n'est pas interdit...
c'est ton erreur du W3C ?

Correction peut être trop tard Smiley ohwell (désolé)

C'est quoi ton erreur W3C ?
Modifié par Wamdeus (17 Nov 2009 - 11:50)
@Wamdeus, j'ai pas compris ta question ?

Mon problème est presque réglé mais j'ai encore un problème Smiley confus ...

Sur la page d'accueil ou autre, les news ou dossiers s'affichent bien sur mozilla, ie, opera mais le menu et complètement partie en live sur ie et opéra, je sais pas si c'est le fait d'utiliser le contexte de formatage qui fait cela mais c'est vraiment moche je vous met le lien pour que vous puissiez regarder :

http://mangasrt.power-heberg.com/

Voilà si quelqu'un a une solution, qu'il men fait part s'il vous plait.

Cordialement, DjaSama
a oui, ça part en sucette, a mon avis c'est ton css qui "foire" tout, dans le forum css y'a un sujet dessus, je vais voir si je peux trouver ça.
Cherche également de ton côté, c'est un problème de compatibilité entre les navigateurs je crois

ton code passe au W3C ??
Oui, Oui mon code html et css sont valides mais chez toi, la site est bien affiché avec mozilla et ça foire avec ie ?
c'est ca !
Mets nous ton css qu'on jette un oeil.
contact Corrine S. et/ou laurie-anne elles sont balaises sur ça
Voilà, je mets le css et je contact ces personnes comme tu me l'a proposé Smiley smile 



body
{
	background-image:url(http://mangasrt.power-heberg.com/template/images/fond.png);
	background-repeat:repeat;
	width:1025px;
	margin:auto;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
}

#header
{
	background-image:url(http://mangasrt.power-heberg.com/template/images/header.png);
	background-repeat:no-repeat;
	width:1024px;
	height:240px;
	margin:0 auto;
}

#information
{
	background-image:url(http://mangasrt.power-heberg.com/template/images/information.png);
	width:1006px;
	height:168px;
	margin:0 auto;
}

#global {

	background-image: url(http://mangasrt.power-heberg.com/template/images/contenu.png);
	background-repeat: repeat;
	width:1024px;
	margin:0 auto;

}

#content {

	float: left;
	width: 515px;
	margin-right: 15px;
	margin-left: 110px


}

#menu {

	width:220px;
	overflow: hidden;
}

#menu  a
{
	color:#ffffff;
	text-decoration:none;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

#menu  a:hover{
	color:#ff9900;
	text-decoration:none;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

#partenaire {

	float: right;
	width: 90px;
	margin-right: 90px;


}


#footer
{
	background-image:url(http://mangasrt.power-heberg.com/template/images/footer.png) ;
	font-family:"Calibri", Verdana, Arial, Times News Roman;
	color:#000000;
	width:1024px;
	height:99px;
	margin: 0 auto;
	clear:both;
}

.copy
{ 
	font-size:11px;
	margin-top:0px;
	padding-top:62px;
	padding-left:110px
}

.stats
{
	float:left;
	margin-top:18px;
	margin-left:230px;
	color:white;
	clear:both;
}

.chapitre_inform
{
	float:left;
	margin-top:17px;
	margin-left:45px;
	
}

.last_chap
{
	float:left;
	margin-top:20px;
	margin-left:170px;
	
}

.last_episode
{
	float:right;
	margin-top:20px;
	margin-right:125px;
	
}

.bouton_menu
{
	float:right;
	margin-top:0px;
	margin-right:31px;
	
}




Cordialement,DjaSama
Pages :
Sujet clos
Aller à