pseudoclassi before e after su un div con display:none

[vinicioxx]

Ciao a tutti!

Ho un problema nel creare un foglio di stile per la stampa. Il sito che sto costruendo presenta un bannerone in alto, composto da varie parti (dei div con degli sfondi), che vorrei evitare che venga stampato; quindi ho settato ad es:

#banner1 {
display:none;
}

Però mi farebbe comodo mantenere stampabili alcune informazioni, che avevo già affidato agli attributi title dei div che compongono il bannerone, con l'idea che mettendo

#banner1:after {
content:attr(title);
}

avrei avuto la stringa del titolo bella in alto prima del contenuto.
Cosa che prontamente non funziona.
Mi sapete consigliare una soluzione (preferibilmente pulita, evitando di aggiungere pezzi di codice in giro nell'html) al mio problema? Grazie a tutte le anime pie che sapranno aiutarmi!

[piccola curiosità: capita solo a me che Opera stampi per default anche gli sfondi dei div?]

[gengix]

Ciao,
Partiamo dalla fine del tuo post:

[piccola curiosità: capita solo a me che Opera stampi per default anche gli sfondi dei div?]

Di default la maggior parte dei browser in fase di stampa non stampa sfondi colorati o immagini, per dare un "servizio" all'utente facendogli risparmiare quantità eccessive di inchiostro.
L'utente se vuole stampare gli sfondi deve andare a spuntare l'opzione nelle impostazioni del browser. Probabilmente Opera va controcorrente.

Utilizzare i valori di attributo penso sia soluzione un po' laboriosa, anche perchè non è supportata da tutti i browser.
Inoltre secondo me c'è un errore di fondo nel tuo codice, dando la proprietà display:none rimuovi tutto il contenuto, anche l'eventuale attributo che inserisci dopo.
Secondo me per essere visualizzato dovresti scrivere al massimo così:

#banner1 {
display:none;
}
#banner1[title] {
display:block;
content:attr(title);
}

Non so dirti però se funziona.

Io non scarterei a priori l'utilizzo di un elemento testuale nella struttura. Lo farei scomparire nel foglio di stile normale mentre lo visualizzerei nella stampa.

Semanticamente non sarebbe sbagliato se questo elemento può dare delle informazioni supplementari che possono agevolare l'utente ( mi riferisco anche nel caso dei lettori di schermo).

Non farei scomparire del tutto il banner contenitore in fase di stampa con display:none (al massimo i div che sono al suo interno).
Successivamente scriverei una regola per il div, dove al posto degli sfondi vi sia uno sfondo uniforme (magari bianco) e eliminerei le altre proprietà che sono inutili a mezzo stampa.

Non so se mi sono spiegato=), senza vedere il tuo codice diventa difficile ragionare.

[vinicioxx]

Ciao, grazie mille per la tua risposta!
Purtroppo il tuo suggerimento non funziona (e poi in effetti mi sono tenuto un po' troppo sul generico quindi rimedio subito)
Il codice html incriminato è questo:

<div id="logoLab"></div>
<div id="scrittaLab"><h1 title="Artificial Intelligence Lab">Artificial Intelligence Lab</h1></div>
<div class="sections">
	<div class="section" id="section-home">
		<h2 title="Homepage">Homepage</h2>
	</div>
</div>
<div id="contenuto">...</div

con la rispettiva porzione css per lo schermo:

#logoLab {border:thin navy solid;
	width:320px; height:320px;
	background:url(../images/logo.gif) no-repeat top left;
	float:left;
}
#scrittaLab h1, .section h2 {
	display:none;
}
#scrittaLab {border:thin blue solid;
	width:640px; height:160px;
	margin-left:320px;
	background:url(../images/scrittaAI.jpg) no-repeat top left;
}
.sections {border:thin green solid;
	width:640px; height:80px;
	margin-left:320px;
	background:url(../images/sections.jpg) no-repeat top left;
}
.section {border:thin red solid;
	width:428px; height:54px;
	position:relative; top:13px; left:65px;
}

con questo risultato

Leggendo ciò che mi hai scritto mi viene anche il sospetto che evitare di visualizzare a schermo h1 e h2 (che sostanzialmente sono i titoli che vorrei mantenere nella stampa) possa creare qualche problema per i browser non visuali...
Comunque, un problema per volta ora come ora mi interesserebbe di più sistemare la pagina di stampa.
Grazie della pazienza!

[vinicioxx]

Mannaggia, non riesco a venirne fuori.. sembra che l'unica soluzione, volendo evitare di visualizzare i div del bannerone, sia aggiungere un div nascosto alla visualizzazione e visibile per la stampa contenente le informazioni utili.