Errors:document type does not allow element "style" here

[ubbicom]

Ciao, come da titolo della discussione.

La validazione XHTML 1.0 segnala 3 errori:

Errors found while checking this document as XHTML 1.0 Transitional!

Validation Output: 3 Errors

Line 252, Column 23: document type does not allow element "style" here
<style type="text/css">
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

Line 400, Column 23: document type does not allow element "style" here
<style type="text/css">
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

Line 414, Column 23: document type does not allow element "style" here
<style type="text/css">
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

Il problema sono dei fogli di stile che funzionano in base a delle query eseguite in ASP e che ho dovuto inserire in dei contesti che probabilmente la validazione non consente.

Questo è il codice originale della pagina ASP.

Per le riga 252 segnalata come errore:

<%

  SQL = "SELECT *, SUBSTRING_INDEX(SUBSTRING_INDEX(CSS2,'/',4),'/',-1) CARTELLA "
  SQL = SQL & " FROM TBL_E "
  SQL = SQL & " WHERE 1 "
  SQL = SQL & " AND DATA >= CURRENT_DATE "
  SQL = SQL & " AND VALIDO = 0 "
  SQL = SQL & " ORDER BY DATA ASC " 
               
  set objRs = Server.CreateObject("ADODB.Recordset")
  objRs.Open SQL, objConn
          
  If Not objRs.EOF Then

<style type="text/css">
<!--
.latestprojectspic {
	background-image: url(/casting/images/<%=objRs.fields("cartella")%>/<%=objRs.fields("css")%>);
	background-repeat: no-repeat;
	margin: 0px;
	float: left;
	height: 133px;
	width: 236px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 165px;
}
-->
</style>

     <div class="latestprojectspic"></div>
<%
     end if
     objRs.close()
     set objRs = Nothing     
%>

Per le righe 400 e 414 segnalate come errore:

<%
     SQL = " SELECT DISTINCT * FROM tbl_gallerypics " 
     SQL = SQL & " ORDER BY RAND() LIMIT 0, 2 "
          
     set objRs = Server.CreateObject("ADODB.Recordset")
     objRs.Open SQL, objConn
          
     If Not objRs.EOF Then
     Do While Not objRs.EOF
%>       

<style type="text/css">
<%=objRs.fields("stile")%>
</style>     
     <div class="<%=objRs.fields("pic")%>"></div>
<%
     objRs.MoveNext()
     Loop
     end if
     objRs.close()
     set objRs = Nothing     
%>

Questo è invece l'output in html (riga 252):

document type does not allow element "style" here 

252.<style type="text/css">
253.<!--
254.latestprojectspic {
255.background-image: url(/casting/images/cartella1/logo.jpg);
256.background-repeat: no-repeat;
257.margin: 0px;
258.float: left;
259.height: 133px;
260.width: 236px;
261.padding-top: 25px;
262.padding-right: 0px;
263.padding-bottom: 0px;
264.padding-left: 165px;
265.}
265.-->
266.</style>

Output in html (righe 400 e 414):

document type does not allow element "style" here

400.<style type="text/css">
401.gallerypic6 { 
402.background-image : url(/casting/images/_gallery/gallery6.jpg); 
403.background-repeat : no-repeat; 
404.margin : 3px; 
405.padding : 0; 
406.float : left; 
407.height : 90px; 
408.width : 120px; 
409.} 
410.</style> 


414.<style type="text/css">
415.gallerypic5 { 
416.background-image : url(/casting/images/_gallery/gallery5.jpg); 
417.background-repeat : no-repeat; 
418.margin : 3px; 
419.padding : 0; 
420.float : left; 
421.height : 90px; 
422.width : 120px; 
423.} 
424.</style>

Avete idea come si possa risolvere?
Grazie mille.

[Simo990]

Ciao, puoi creare un foglio di stile esterno (con estensione .css) inserendoci dentro tutto il codice css della tua pagina (quello dentro i tag <style type="text/css">codice</style>), cancellando i tag <style type="text/css"> e </style>. Poi inserisci questo tag tra i tag <head> e </head>:

<link type="text/css" rel="stylesheet" media="screen" href="nome_del_tuo_foglio_di_stile_esterno.css" />

vedrai che dopo la tua pagina web sarà un documento XHTML 1.0 valido.

[ubbicom]

Grazie per la risposta ed il suggerimento, purtroppo non funziona così:

latestprojectspic.css

.latestprojectspic {
	background-image: url(/casting/images/<%=objRs.fields("cartella")%>/<%=objRs.fields("css")%>);
	background-repeat: no-repeat;
	margin: 0px;
	float: left;
	height: 133px;
	width: 236px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 165px;
}

<head>
<link type="text/css" rel="stylesheet" media="screen" href="latestprojectspic.css" />
</head>

E nemmeno così:

latestprojectspic.asp

<%  Response.ContentType = "text/css" %>

latestprojectspic {
	background-image: url(/casting/images/<%=objRs.fields("cartella")%>/<%=objRs.fields("css")%>);
	background-repeat: no-repeat;
	margin: 0px;
	float: left;
	height: 133px;
	width: 236px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 165px;
}

Inclusione nella pagina:

<head>
<link type="text/css" rel="stylesheet" media="screen" href="latestprojectspic.asp" />
</head>

Nel primo caso non si valorizzano le variabili:

<%=objRs.fields("cartella")%>/<%=objRs.fields("css")%>

Nel secondo caso invece sul browser si apre il sorgente HTML della pagina stessa...

[ubbicom]

Una soluzione l'ho trovata, ma adesso la validazione restituisce 3 errori per XHTML 1.0 Transitional e 2 errori per il CSS.

Non so dove sbattere la testa.

<head>
  <title>CSS DINAMICO</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <link type="text/css" rel="stylesheet" media="screen" href="/css/latestprojectspic.asp?strCss=<%=strCss%>&#38;strCartella=<%=strCartella%>" />
</head>

latestprojectspic.asp

<% Response.ContentType = "text/css" %>
.latestprojectspic {
	background-image: url(/images/<%=request.querystring("strCartella")%>/<%=request.querystring("strCss")%>);
	background-repeat: no-repeat;
	margin: 0px;
	float: left;
	height: 133px;
	width: 236px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 165px;
}

Validazione CSS:

Errori (2)
URI : http://www.MiaPaginaWeb/css/latestpr...e=.gallerypic3 { background-image : url(/images/_gallery/gallery3.jpg); background-repeat : no-repeat; margin : 3px; padding : 0; float : left; height : 90px; width : 120px; }
-1		 File non trovato: http://www.MiaPaginaWeb/css/latestpr...e=.gallerypic3 { background-image : url(/images/_gallery/gallery3.jpg); background-repeat : no-repeat; margin : 3px; padding : 0; float : left; height : 90px; width : 120px; }: Bad Request
URI : http://www.MiaPaginaWeb/css/latestpr...=.gallerypic11 { background-image : url(/images/_gallery/gallery11.jpg); background-repeat : no-repeat; margin : 3px; padding : 0; float : left; height : 90px; width : 120px; }
-1		 File non trovato: http://www.MiaPaginaWeb/css/latestpr...=.gallerypic11 { background-image : url(/images/_gallery/gallery11.jpg); background-repeat : no-repeat; margin : 3px; padding : 0; float : left; height : 90px; width : 120px; }: Bad Request

Validazione XHTML 1.0:

Validation Output: 3 Errors

 Line 252, Column 6: document type does not allow element "head" here
<head>
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

 Line 387, Column 6: document type does not allow element "head" here
<head>
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

 Line 410, Column 6: document type does not allow element "head" here
<head>
✉
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

[Simo990]

Non so esattamente come funzioni la tua pagina, quindi non so bene come aiutarti. L'errore di validazione document type does not allow element "style" here viene segnalato quando c'è un tag <style> dentro a <body>, e in questo caso per risolvere basta fare come ho detto io con i fogli di stile esterni oppure spostando il css all'interno di <head>. Il tuo caso è un po' diverso, c'è una dipendenza con l'oggetto ADODB.Recordset. Purtroppo non so aiutarti perché non conosco né ASP né la logica del tuo codice, posso solo consigliarti di lasciare tutto così com'è: in fondo è meglio una pagina funzionante, anche se con qualche errore di validazione, piuttosto che una pagina rotta

[Simo990]

Non avevo letto la tua ultima risposta, comunque gli errori del css ti dicono che le immagini non sono state trovate: controlla che il percorso sia giusto.
Gli errori di validazione invece sono sempre quelli: ti stanno dicendo che hai 3 porzioni di codice <style> codice css </style> che secondo lo standard del W3C andrebbero all'interno di <head></head> e non di <body></body>.

[ubbicom]

Grazie per aver risposto.

comunque gli errori del css ti dicono che le immagini non sono state trovate: controlla che il percorso sia giusto.

Il percorso è giusto e le immagini ci sono, continuo a non capire l'errore.

Gli errori di validazione invece sono sempre quelli: ti stanno dicendo che hai 3 porzioni di codice <style> codice css </style> che secondo lo standard del W3C andrebbero all'interno di <head></head> e non di <body></body>.

E' già così, ho seguito le tue preziose indicazioni, ma non si è risolto nulla:

 
<head>
<title>CSS DINAMICO</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<link type="text/css" rel="stylesheet" media="screen" href="/css/latestprojectspic.asp?strCss=<%=strCss%>&strCartella=<%=strCartella%>" /> 
</head>

posso solo consigliarti di lasciare tutto così com'è: in fondo è meglio una pagina funzionante, anche se con qualche errore di validazione, piuttosto che una pagina rotta

Probabilmente hai ragione lascerò tutto per com'è... anche se qualcuno (un milanista )ha definito inappropriato nel mio caso inserire i loghi di validazione CSS, dell'HTML e dell'accessibilità.