Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1654 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Noob] Pb avec le HTML 4.01 Transitional

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[Noob] Pb avec le HTML 4.01 Transitional

n°322807
*syl*
--> []
Posté le 04-03-2003 à 18:35:22  profilanswer
 

Slt !
 
J'arrive pas à corriger les erreurs que le W3C me trouve alors voici mon pb :
 

Citation :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
 
<style type="text/css">
 img#verti {
  vertical-align: middle
 }
</style>
</HEAD>
<BODY>
<IMG SRC="images/email.gif" ID="verti" ALT="Email" />
<IMG SRC="images/email.gif" ID="verti" ALT="Email" />
</BODY>
</HTML>


 

Citation :

Line 11, column 6: end tag for "HEAD" which is not finished (explain...).  
  </HEAD>
        ^
Line 14, column 32: ID "VERTI" already defined (explain...).  
  <IMG SRC="images/email.gif" ID="verti" ALT="Email" />
                                  ^
Line 13, column 32: ID "VERTI" first defined here (explain...).  
  <IMG SRC="images/email.gif" ID="verti" ALT="Email" />


 
Un ch'ti peu d'aide serait le bienvenue :)

mood
Publicité
Posté le 04-03-2003 à 18:35:22  profilanswer
 

n°322808
kadreg
profil: Utilisateur
Posté le 04-03-2003 à 18:36:29  profilanswer
 

Dans un document XML, les ID sont uniques. Utilise plutot le concept de class qui correspond plus à ce que tu cherches.


---------------
brisez les rêves des gens, il en restera toujours quelque chose...  -- laissez moi troller sur discu !
n°322813
*syl*
--&gt; []
Posté le 04-03-2003 à 18:44:36  profilanswer
 

J'vais voir de ce côté, merci :)
 
Et pour le column 6: end tag for "HEAD" which is not finished ?

n°322814
kadreg
profil: Utilisateur
Posté le 04-03-2003 à 18:46:02  profilanswer
 

*Syl* a écrit :

Et pour le column 6: end tag for "HEAD" which is not finished ?


 
 content="text/html;
 
Le guillemet est pas fermé


---------------
brisez les rêves des gens, il en restera toujours quelque chose...  -- laissez moi troller sur discu !
n°322818
gm_superst​ar
Appelez-moi Super
Posté le 04-03-2003 à 18:49:00  profilanswer
 

kadreg a écrit :


 
 content="text/html;
 
Le guillemet est pas fermé


Non, non ça c'est juste ;)  
 
content contient "text/html; charset=iso-8859-1"


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°322820
kadreg
profil: Utilisateur
Posté le 04-03-2003 à 18:50:13  profilanswer
 

gm_superstar a écrit :


Non, non ça c'est juste ;)


 
mairde
 
[:neowen]


---------------
brisez les rêves des gens, il en restera toujours quelque chose...  -- laissez moi troller sur discu !
n°322826
*syl*
--&gt; []
Posté le 04-03-2003 à 18:55:07  profilanswer
 

C'est bon pour le head, j'avais pas mis de title :sweat:

n°322832
antp
Super Administrateur
Champion des excuses bidons
Posté le 04-03-2003 à 18:57:02  profilanswer
 

pour faire plus propre :
 
<style type="text/css"><!--
img#verti {
 vertical-align: middle
}
//--></style>
 
idem pour le javascript éventuelle, pour pas que le validateur ou le browser ne tente d'interprêter ça comme du html


Message édité par antp le 04-03-2003 à 18:58:18
n°324421
*syl*
--&gt; []
Posté le 06-03-2003 à 11:26:58  profilanswer
 

kadreg a écrit :

Dans un document XML, les ID sont uniques. Utilise plutot le concept de class qui correspond plus à ce que tu cherches.

J'ai essayé d'utiliser le concept de classes mais ça s'aligne pas verticalement.. :sweat:  
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4. <META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  5. <title>test</title>
  6. <style type="text/css">
  7. .verti
  8. {
  9. vertical-align: middle;
  10. }
  11. </style>
  12. </HEAD>
  13. <BODY>
  14. <div class="verti">
  15. <IMG SRC="images/email.gif" ALT="Email" />Test<BR />
  16. <IMG SRC="images/email.gif" ALT="Email" />Test
  17. </DIV>
  18. </BODY>
  19. </HTML>

J'ai essayé différement trucs comme mettre div.verti, mettre les div seulement autour du texte, ... mais rien ne marche :cry:

n°324431
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 11:29:58  profilanswer
 

Tu veux faire quoi ? Que les images soient centrées dans la page ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
mood
Publicité
Posté le 06-03-2003 à 11:29:58  profilanswer
 

n°324443
*syl*
--&gt; []
Posté le 06-03-2003 à 11:34:57  profilanswer
 

Non, en fait, j'ai un tableau avec une image + texte dans chaque cellule et je voudrais que le texte soit centré verticalement dans la cellule pour faire propre (pour l'image : pas besoin, taille de la celulle = la taille de l'image)..

n°324452
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 11:39:52  profilanswer
 

Dans ce cas, il faut appliquer vertical-align à la cellule.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°324454
*syl*
--&gt; []
Posté le 06-03-2003 à 11:40:57  profilanswer
 

C'est un truc que j'ai déjà dû faire, je reteste et dis quoi.. :)

n°324475
*syl*
--&gt; []
Posté le 06-03-2003 à 11:49:05  profilanswer
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4. <META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  5. <title>test</title>
  6. <style type="text/css">
  7. .verti
  8. {
  9. vertical-align: middle;
  10. }
  11. </style>
  12. </HEAD>
  13. <BODY>
  14. <TABLE><TR>
  15. <DIV class="verti">
  16. <TD><IMG SRC="images/email.gif" ALT="Email" />Test</TD>
  17. </DIV>
  18. </TR></TABLE>
  19. </BODY>
  20. </HTML>


Ça marche pas ou j'm'y prends mal [:spamafote]


Message édité par *syl* le 06-03-2003 à 11:49:23
n°324480
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 11:52:23  profilanswer
 

Mais il sert à rien ton div. Applique ça au TD !


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°324489
*syl*
--&gt; []
Posté le 06-03-2003 à 11:57:02  profilanswer
 

J'apprends par la méthode du try&fail, désolé :ange:  
 
Le div vient de tilter et j'ai appliqué le style au td comme ceci :

Code :
  1. <TABLE><TR><TD class="verti">
  2. <IMG SRC="images/email.gif" ALT="Email" />Test
  3. </TD></TR></TABLE>

Mais..c'est tjrs pas centré  :sweat:  
 
Où ai-je merdé encore ? :whistle:

n°324496
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 12:02:10  profilanswer
 

Ah oui. J'avais pas vu que l'image et le texte sont dans la même cellule. Dans ce cas applique ta classe à l'image.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°324506
*syl*
--&gt; []
Posté le 06-03-2003 à 12:07:04  profilanswer
 

C'est le texte que je veux centrer, pas l'image..

n°324509
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 12:14:00  profilanswer
 
n°324520
*syl*
--&gt; []
Posté le 06-03-2003 à 12:23:57  profilanswer
 

Wé j'avais essayé au cas ou.. mais sans succès :'(

n°324530
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 12:30:11  profilanswer
 

Gniiiii ? Je viens de tester :
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
  <HEAD>
    <META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>test</title>
    <style type="text/css">
  .verti
  {
     vertical-align: middle;
  }
    </style>
  </HEAD>
   
  <BODY>
   
    <TABLE>
      <TR>
        <TD><IMG "images/email.gif" class="verti"  ALT="Email" >Test</TD>
      </TR>
    </TABLE>
  </BODY>
</HTML>


 
Et ça marche. Le mot "Test" est bien centré verticalement par rapport à l'image (qui impose sa taille à la cellule)
 
Tu testes avec quoi ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°324540
*syl*
--&gt; []
Posté le 06-03-2003 à 12:37:09  profilanswer
 

Oups désolé, j'avais merdé en faisant le copier/coller, j'avais oublié de retirer le point devant verti :pt1cable:  
On va mettre ça sur le coup de la faim, j'avais l'estomac creux depuis hier soir.. :sweat:  
 
Merci bcp pour ton aide :)
 
 :hello:

n°324542
*syl*
--&gt; []
Posté le 06-03-2003 à 12:39:38  profilanswer
 

Le système est qd même bizarre puisque j'applique le style qu'à l'image et non au texte :heink:

n°324584
gm_superst​ar
Appelez-moi Super
Posté le 06-03-2003 à 13:13:28  profilanswer
 

En fait c'est normal quand on sait comment fonctionne vertical-align : http://www.yoyodesign.org/doc/w3c/ [...] ical-align
 

Citation :

Cette propriété agit sur le positionnement vertical à l'intérieur de la boîte de ligne des boîtes générées par un élément de type en-ligne. Les règles suivantes n'ont de sens que par rapport à un élément parent de type en-ligne, ou de type bloc si celui-ci génère des boîtes en-ligne anonymes ; elles sont inopérantes autrement.


 
Autrement dit vertical-align ne marche que dans 2 cas :
 
- Sur un élément de type en-ligne (ici l'image) à l'intérieur d'une boîte qui contient des éléments en ligne (un élément en-ligne est comparable à du texte et une image est considérée comme du texte : la preuve les smileys ici sont alignée sur la même ligne de base du texte)
Dans ton cas la boîte est anonyme c'est à dire qu'elle n'est pas représentée par un élément HTML ; mais elle existe, c'est celle qui contient l'image ainsi que le mot "Test". Si tu ajoutes un élément <span> autour de l'image et du mot elle ne sera plus anonyme mais elle sera comme une boîte normale qui contient des éléments en-ligne. Or ici c'est l'image qui impose la hauteur de la boîte (car elle est plus haute que le texte). Vertical-align permet de modifier l'alignement vertical à l'intérieur de cette boîte.
 
- Sur des cellules de tableaux (seul élément à ma connaissance qui génère des boîtes en-ligne anonymes.)
Dans ce cas vertical-align modifie l'alignement vertical de la boîte anonyme à l'intérieur de la cellule et non pas, comme dans le cas précédent, l'alignement vertical des éléments qui *sont* dans la boîte anonyme.
C'est pour ça que dans ton cas on ne peut pas appliquer vertical-align à la cellule car la cellule et la boîte anonyme font la même hauteur.
 
 
En espérant avoir été clair [:totoz]


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°324595
*syl*
--&gt; []
Posté le 06-03-2003 à 13:23:58  profilanswer
 

mé keskidi [:totoz]  
 
C'est pas très clair dans mon esprit même après avoir lu ton post plusieurs fois mais bon, si un jour j'ai un autre pb d'alignement, j'irais relire ce post :jap: :)

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Noob] Pb avec le HTML 4.01 Transitional

 

Sujets relatifs
Newsletter HTMLBesoin d'aide en HTML
[HTML] DIV : peut on faire une div étirée en hauteur ?petite question pour le language html
[HTML] question de balise[XML-HTML] newbie inside - interpreter du code HTML contenu dans XML
le tag html qui permet de mettre la fenêtre en plein écran (F11)[HTML & JS] Pb avec un lien ...
[HTML, JS] Accès pointeur ligne d'un tableau htmlnorm html
Plus de sujets relatifs à : [Noob] Pb avec le HTML 4.01 Transitional


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR