28221 sujets

CSS et mise en forme, CSS3

Validation code CSS par W3C (RÉSOLU)

Bonjour,
Voici 2 questions (de débutant, faut-il le préciser ?)

1.
La validation du code CSS par le W3C me signale :
a écrit :
Ligne: 8 Contexte : body
La propriété a n'existe pas. : text-decoration

Ligne: 8 Contexte : body
Erreur lors de l'analyse grammaticale. - : none;


Cela métonne car j'ai trouvé cet élément dans le livre d'Eric A. Meyer "More on Eric Meyer on CSS" (p.227) qui, paraît-il, est une référence en la matière.

2.
Autre remarque du W3C :
a écrit :

Ligne: 12
Erreur lors de l'analyse grammaticale. - : #A8B4C1 } div#outer


Je ne comprends pas ce que cela signifie, d'autant plus que je ne trouve pas ce code de couleur à cet endroit.

Voici mon code CSS entier : 

/* CSS Document */

body {
	background-color: #A8B4C1;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000033;
	a: text-decoration : none;
    scrollbar-base-color: #A8B4C1
}

div#outer {
	width: 900px;
	padding: 0px;
	border: medium solid #000000;
	margin: 25px auto 10px;

}

div#header {
	padding: 0px;
	margin: 0px;
	text-align: center;
	background: url(images2/banniere900x180.jpg) no-repeat center center;
	height: 180px;
	border-bottom: thick solid #8192A6;
	width: 900px;

}
div#nav {
	height: 30px;
	width: 100%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	background-color: #A8B4C1;
	text-align: center;
}
div#nav
 ul {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #FFF;
	line-height: 30px;
	white-space: nowrap;
	font-weight: bold;
}
div#nav li {
    list-style-type: none;
    display: inline;
}
div#nav li a {
    text-decoration: none;
    padding: 7px 10px;
    color: #FFF;
}
div#nav li a:link {
    color: #FFF;
}
div#nav li a:visited {
    color: #FFF;
}
div#nav li a:hover {
    font-weight: bold;
    color: #FFF;
    background-color: #72869C;
}
div#main {
	width: 100%;
	padding: 0px;
	height: 400px;
	color: #000066;
	background: #E6E9EC;
	margin: 0px;
	overflow: auto;
	border: 1px solid #000000;
}

div#footer {
	padding: 5px;
	margin: 0px;
	border-top: thin solid #000000;
	height: 30px;
	clear: both;
	text-align: center;
	vertical-align: middle;
	background: #A8B4C1;

}
p {
	text-align: justify;
	line-height: normal;
}
blockquote {
	margin: 10px;
	padding: 0px;
}
.cadrimage {
	text-align: center;
	border: 1px solid #000066;
}
.liens {
	font-size: 10px;
	color: #000066;
	text-decoration: none;
	list-style: square;
}
.textefoot {
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bold;
}
.flashback {
	font-style: italic;
	padding: 5px;
	float: right;
	height: auto;
	width: 80%;
	border: 1px solid #6B7998;
	background: #D3E0E7;
}
.listechapitres {
	font-size: 12px;
	font-style: italic;
	line-height: 1.5em;
	font-weight: bold;
	color: #000066;
	text-decoration: none;
	list-style: Aucune;
}
.notes {
	font-size: 10px;
	color: #993366;
	text-align: justify;
}
h5 {
	font-size: 11px;
	font-style: italic;
	font-weight: bold;
	text-align: right;
}


et éventuellement l'URL du site concerné :


Merci.
Modifié le 08 Feb 2005 - 13:58
vivi a écrit :


/* CSS Document */

body {
	background-color: #A8B4C1;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000033;
	a: text-decoration : none;
    scrollbar-base-color: #A8B4C1
}

div#outer {
	width: 900px;
	padding: 0px;
	border: medium solid #000000;
	margin: 25px auto 10px;

}



Salut vivi,

tu ne peux pas définir un élement à l'intérieur même de la définition d'un autre élément. pour définir ton a, fais plutôt ceci :


a {
  text-decoration:none;
}


En ce qui concerne ta seconde question, en fait le probléme ne vient pas directement de la ligne 12,mais de la derniere ligne de la définition de ton élément body, regarde bien tu a oublié le ; aprés : scrollbar-base-color: #A8B4C1

Voila espérant que cela puisse t'aider
hum... Smiley hum Bien essayé mplessis Smiley cligne

mplessis a écrit :

En ce qui concerne ta seconde question, en fait le probléme ne vient pas directement de la ligne 12,mais de la derniere ligne de la définition de ton élément body, regarde bien tu a oublié le ; aprés : scrollbar-base-color: #A8B4C1

En fait, le ; n'est pas obligatoire à cet endroit (il sert à séparer les déclarations).
C'est plutôt le scrollbar-base-color (langage propriétaire Microsoft) qui est invalide dans CSS2...

<edit />
Par contre, bien visé ici : Smiley lol 

a {
  text-decoration:none;
}

Modifié le 08 Feb 2005 - 10:11
Petite remarque en passant : en CSS comme en HTML, une erreur réelle peut conduire le validateur à annoncer d'autres pseudo-erreurs, voire à ignorer comme ici une seconde erreur "vraie". Le parser qui traite votre code est en fait simplement incapable de reprendre la lecture de manière correcte après certaines erreurs de syntaxe.

C'est pourquoi il est souvent préférable de procéder à des corrections/validation successives, en identifiant la première "vraie" erreur dans l'ordre du code et en la traitant en premier...
Laurent Denis a écrit :

C'est pourquoi il est souvent préférable de procéder à des corrections/validation successives, en identifiant la première "vraie" erreur dans l'ordre du code et en la traitant en premier...

...qui fait que l'on peut corriger une trentaine d'erreurs en 3 coups de pinceau Smiley biggol
Autant pour moi donc pour le ; pas obligatoire sur la derniére ligne, je ne le savait pas......

J'avoue n'avoir jamais essayé de ne pas le mettre.
Un grand merci pour vos conseils.
J'ai relancé la validation après corrections; voici le nouveau message :

a écrit :

Ligne: 9 Contexte : body
Erreur lors de l'analyse grammaticale. - { text-decoration:none

Ligne: 10 Contexte : body
La propriété scrollbar-base-color n'existe pas. : #a8b4c1


Je savais que la propriété scroll-base-color n'existe pas, mais je n'en tiens pas compte car je veux la conserver puisqu'elle fonctionne avec IE

Concernant le "text-decoration:none", une erreur demeure, mais laquelle ? voici l'extrait de mon code qu'il me semblait avoir bien corrigé : 

body {
	background-color: #A8B4C1;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000033;
	a {
  text-decoration:none;
  scrollbar-base-color: #A8B4C1;
}

body {
background-color: #A8B4C1;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color: #000033;
scrollbar-base-color: #A8B4C1;
}
a {
text-decoration:none;
}


body {
	background-color: #A8B4C1;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000033;
        scrollbar-base-color: #A8B4C1}
a { text-decoration:none}


il faudrait que tu te penche sur ce qu'est précisément un sélecteur Smiley smile et le fait qu'ils ne sont pas imbriquables (enfin je me comprends Smiley lol )

edit: damn, il m'a eu
Modifié le 08 Feb 2005 - 10:47
a écrit :
il faudrait que tu te penches sur ce qu'est précisément un sélecteur

Je m'y suis penchée - j'ai compris ma confusion - le mal est réparé Smiley clapclap Smiley hotbounce On en apprend des choses sur ce forum !
MERCI !
Ce qui explique peut-être certaines confusions et des imbrications erronées comme celle-ci, c'est qu'il y a effectivement une imbrication correcte, dans un cas très précis: les règles @media:


@media screen {
  p {
  color: red;
  }
}
@media print {
  p {
  color: #000;
  }
}


A retenir : pas d'imbrication quand il n'y a pas de @ Smiley cligne
a écrit :
A retenir : pas d'imbrication quand il n'y a pas de @


Je découvre ici l'existence de cette règle (@media).
J'ai voulu en savoir plus, j'ai cherché et - si j'ai bien compris - c'est une méthode qui permet de définir une configuration (de font, par exemple) qui soit adaptée à différents media tels que document imprimé, écran PC ou je ne sais quoi d'autre (PDA ?)

C'est bien cela ? Smiley idee2
Administrateur
vivi a écrit :

Je découvre ici l'existence de cette règle (@media).
J'ai voulu en savoir plus, j'ai cherché et - si j'ai bien compris - c'est une méthode qui permet de définir une configuration (de font, par exemple) qui soit adaptée à différents media tels que document imprimé, écran PC ou je ne sais quoi d'autre (PDA ?)

C'est bien cela ? Smiley idee2

C'est possible, mais attention à ne pas confondre avec la propriété "media" qui s'applique à la balise <link>.

Voilà de quoi satisfaire ta curiosité, j'espère Smiley cligne
Raphael a écrit :

C'est possible, mais attention à ne pas confondre avec la propriété "media" qui s'applique à la balise <link>.


C'est exactement la même chose, en fait, sauf que l'un est un attribut HTML et l'autre une règle-AT CSS. Les valeurs d'attribut media en HTML et de règle @media en CSS sont identiques (elles sont déterminées par CSS et non par HTML) et le rôle est identique : cibler le ou les media visés par un ensemble de styles.
Merci pour ces détails.
Je sens que le CSS va devenir mon "livre de chevet".
Ma vie sera-t-elle assez longue pour tout comprendre ? Smiley vieux
vivi a écrit :

Ma vie sera-t-elle assez longue pour tout comprendre ? Smiley vieux

Non. Mais rassure-toi, suffit de comprendre l'essentiel et de bien le mettre en pratique. À titre d'exemple, il faut connaître environ 20 000 mots pour avoir une conversation intelligente. Ce n'est pas parce que tu connais le dictionnaire par coeur que tu causes intelligemment. C'est même la meilleure manière de faire fuir le commun des mortels. Smiley cool
Administrateur
Je crois plutôt que c'est 2 000 mots, pas 20 000. Smiley cligne

http://www.abm.fr/pratique/langue.html

20 000 ne doit pas être rare mais faut déjà être limite érudit.
Avec 2 000 mots d'une langue étrangère, c'est déjà suffisant (au moins 1 000 je suppose, plus en français qu'en anglais sûrement)
<encore-hors-sujet id="mais-il-est-résolu-non-?" title="alors-pourquoi-pas-!" />

En langue seconde certe, mais pas en langue maternelle Smiley cligne (oui je sais, volonté d'avoir le dernier mot) Smiley biggol
Serpsy a écrit :

3-Langue parlée, langue écrite, difficultés de l'écrit

Qu'est-ce qui différencie le texte écrit, la narration du récit oral en dehors du fait que l'un est écrit et l'autre pas ? D'une façon générale la langue écrite est plus soutenue que la langue parlée, on pourrait même affirmer qu'il s'agit d'une autre langue. Les niveaux de langage y sont moins nombreux et directement en rapport avec le conditionnement socio-culturel. Nous noterons que si l'individu moyen connaît approximativement 24 000 mots, soit 50 % de substantifs, 25 % d'adjectifs, 20 % de verbes, 4,5 % d'adverbes et 0,5 % de mots outils, il utilise 20 % de substantifs, 7,5% d'adjectifs, 17 % de verbes, 1,5 % d'adverbes et 50 % de mots outils. Les mots outils s'avèrent donc essentiels à la compréhension et à l'organisation du langage.

http://www.serpsy.org/piste_recherche/mediations/lecture_chapitre4.html

Sauver les lettres a écrit :

Une étude statistique d’Isabel Beck, citée dans le même article, met en lumière l’ampleur des acquisitions lexicales indispensables. Un lycéen américain de Terminale (12th-grade) de bon niveau connaît entre 60 000 et 100 000 mots de sa langue maternelle, disons 80 000. Il a bénéficié (au plus) de 15 années de scolarité et il a donc appris environ 5 000 mots par an, en moyenne 15 mots par jour, que ce soient des jours d’école ou des jours de repos. On apprend énormément de vocabulaire hors de l’école, évidemment, mais beaucoup de mots ne se rencontrent qu’à l’école et dans les livres : tout le vocabulaire littéraire et scientifique, en particulier. La véritable maîtrise d’un élément lexical nécessite une compréhension du domaine contextuel et au moins quatre rencontres avec ce mot (douze rencontres amènent à une maîtrise parfaite). Ces rencontres se font dans des contextes différents et le mot se charge peu à peu d’écailles de sens de ce que je nomme leur constellation sémantique.

http://www.sauv.net/hautelangue.php
Sujet clos
Aller à