ripetere immagine da css (non sfondo)

[danjde]

Ciao a tutti,
da un tema wp,
ho una sorta di logo e l'estremità di questo vorrei che si ripetesse fino ad un determinato punto in altezza (verticale).

Per fare ciò ho creato la parte html:

<div class="entry-meta"></div><div id="logo_top">[img]/wp-content/themes/chaostheory/images/top.png[/img]</div><div class="entry-content"></div>

e la parte css:

#logo_top {
 	background-repeat: repeat-y;
	position: relative;
	float: right;
	left: -426px;
	top: -748px;
}

riesco a posizionare l'elemento grafico ma non riesco a fare in modo che si ripeta;

dove sbaglio?

grazie infinite

[Prill]

Ciao, nel titolo scrivi che non vuoi l'immagine come sfondo, in realtà hai in logo_top il background-repeat (ma manca il background-image), cioè imposti la ripetizione verticale dell'immagine ma non l'immagine che deve fungere da sfondo, che penso sia quella che poi inserisci direttamente nell'html col tag img.
Per averla ripetuta impostala come sfondo di logo_top (ma sarà necessario anche specificare l'altezza del div).
Se invece vuoi allungarla, per far sì che occupi un certo spazio, puoi specificare per l'immagine le dimensioni volute (ma non avrai la ripetizione).
Infine puoi anche modificare l'immagine per come dovrà apparire a schermo ed evitare anche in questo caso che appaia come sfondo

[danjde]

Grazie Prill,
devi scusarmi ma ho da poco approcciato ai css (ho preso il libro css di Giancluca Troiani e lo sto leggendo piano piano..);

ho fatto come mi indichi (almeno nel css):

#logo_top {
 	background-repeat: repeat-y;
	background-image: url('images/top.png');
	position: relative;
	float: right;
	left: -426px;
	top: -748px;
}

ma non vedo l'immagine ripetersi (ho dato anche il path assoluto);

mi consigli di impostarla come sfondo di logo_top (e questo credo di averlo fatto nel css

e di specificare l'altezza del div, ma non ho ben chiaro dove specificarlo, se nel css o nell'html

grazie ancora....

[Nobody33]

Non si può fare cosi come vuoi te.
O imposti l'immagine come sfondo (senza float, left e top) e scrivi +/- come hai fatto te
(puoi anche scrivere background: url('') repeat-y; )

oppure ti potresti creare un paio di div (la loro posizione la definisci nel css) in più dove ogni volta metti l'immagine che vuoi ( nel css oppure nel html, fa +/- lo stesso).

Se posti un link alla pagina, si potrebbe dire di più (tipo non mi è chiara l'altezza e larghezza dell'immagine, ecc.)

[danjde]

ecco il link: http://www.teatroscientifico.com/schede-spettacoli/

in pratica, l'elemento grafico centrale dovrebbe allinearsi idealmente alla linea rossa orrizontale (che si trova ad altezza menu);

grazie ancora tantissimo

[Nobody33]

Sito troppo incasinato; sei partito male perciò è ovvio che ti trovi in difficoltà.

Scaricati un layout da QUI, cosi riparti bene.

Con il layout che ti trovi adesso è tutto un casino.
Per il futuro: dovresti rispettare le impostazioni generali di header, footer, column_sx, content (nel tuo caso).
In linea generale: se usi position: relative, spesso è meglio usare margin-top, margin-right ecc., il che è un'altra cosa di right, left, bottom ecc.

[Prill]

Originariamente inviato da danjde
non vedo l'immagine ripetersi (ho dato anche il path assoluto)

attualmente hai un'immagine larga 1210 pixel, col logo sulla sinistra e poi una parte trasparente, e l'immagine è inserita direttamente nell'html
In generale, se inserisci un'immagine come sfondo ripetuto tramite css, la ripetizione si avrà solo quando le dimensioni del div supereranno quelle dell'immagine stessa (un div, quando non siano impostate le sue dimensioni, ha una larghezza pari al 100% e un'altezza pari a quella dei suoi contenuti: quindi se è vuoto o i suoi contenuti sono pochi o inferiori non visualizzerai o visualizzerai in parte o non avrai la ripetizione dell'immagine di sfondo)

edit: guardando meglio la tua pagina mi pare di capire che il problema sia l'interruzione del filetto verticale rosso fra il div superiore e quello inferiore, prova ad azzerare i margini superiori e inferiori degli elementi a contatto (bene sarebbe azzerare sempre tutti i margini e ripristinarli poi dove servano)