Ciao,
chiedo una cosa che non so se è realizzabile.
ho due div annidiati, entrambi width:100%.
Il secondo background, deve avere uno sfondo ripetuto in percentuale, ovvero deve partire da sinistra e arrivi al 40% della pagina, repeat-x top
Mi sapete dire se è fattibile via css specificare per quanto deve essere ripetuto uno sfondo?
Grazie
Andrea
Provo a darti qualche idea, su cui dovrai lavorare (e provare).
Girando la questione tu vuoi che uno sfondo lasci 60% di vuoto a destra e si ripeta fino a sinistra.
Oppure potresti girare il tutto: fai uno sfondo che parta da 40% da sinistra e siripeta fino in fondo a destra (chiaramente invertendo i colori o motivi tra i due blocchi).
Un passo alla volta (uso i CSS in linea solo per risparmiare righe):Ho supposto che ci siano due immagini/motivi per i due pezzi, ma chiaramente la cosa funziona anche con i colori. Pero` nel blocco interno, e` necessaria un'immagine, che puo` anche essere formata da un solo pixel colorato.codice:<div style="background: url(motivosin.gif) repeat"> <div style="background: transparent url(motivodx.gif) repeat 40% 0"> qualcosa </div> </div>
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Hai colto perfettamente,
diciamo che ho girato parzialmente la cosa anche io....
Ora ho lo sfondo di pagina.. che riempirà il 60% dal centro fino a destra.... e ho un div 100% sopra.. che deve riempire (e non ho un pixel ripetuto) dal centro fino a sinistra.. quindi il 40% restante.
Grazie
Andrea
Ps....
il background del div, deve anche essere allineato in alto, oltre che ripetuto per il 40%.
mubble mubble :master:
Questa non l'ho capita (la sintassi italiana, intendo).Originariamente inviato da lovatos
Ps....
il background del div, deve anche essere allineato in alto, oltre che ripetuto per il 40%.
mubble mubble :master:
Forse se fai un esempio di codice puo` essere piu` semplice capire (il codice va inserito tramite i tag VB opportuni - vedi il bottoncino # sopra il testo da inserire)
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Scusa,
mi sono spiegato veramente male.
Mi spiego.
Come anticipato il div che mi deve fare da maschera al 40%, è width:100%.
Fa da maschera allo sfondo di pagina, dove ho inserito il bg che riempirà il restante 60%.
Ovvero:
body {
margin: 0;
padding: 0;
text-align: center;
background: #5f5f5f url(../grafica/bg_60.jpg) top left repeat-x;
}
#maschera {
width: 100%;
margin: 0px auto;
background: url(../grafica/bg_40.jpg) top left;
}
e nell'html, semplicemente:
<body>
<div id="maschera"> <<<- il bg di questo deve fermarsi al 40% partendo da sinistra e rimanendo allineato in alto
</div>
</body>
PPS
completo...
in alto, ripetuto sull'asse x per il 40%
grazie per la pazienza.
Andrea
Intanto c'e` un errore: il width:100% di maschera non vuole dire nulla, dato che e` il 100% di un valore non definito.
Perche` abbia senso occorre dare width:100% anche a body e ad html.
Quindi io scriverei (con il codice HTML che hai appena scritto):codice:html { width: 100%; } body { width: 100%; margin: 0; padding: 0; text-align: center; /* ???a che serve? */ background: #5f5f5f url(../grafica/bg_40.jpg) repeat-x top left; } #maschera { width: 100%; margin: 0px auto; /* ???a che serve? non puo` avere margini orizz, dato che e` largo 100% */ background: url(../grafica/bg_60.jpg) 40% 0; }
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Ciao ancora,
sai che non va nemmeno così.. il bg della maschera continua ad essere ripetuto 100% x e y.
Ho provato anche con firefox visti i bug di ie.
Prova con la posizione dello sfondo: top center:
background: url(../grafica/bg_60.jpg) top center;
E prova con il posizionamento per pixel, per vedere se ci sono differenze:
background: url(../grafica/bg_60.jpg) 300px 0;
In alternativa occore impedire la ripetizione in orizzontale, ed usare una immagine che sia piu` larga dello spazio che si deve riempire (per qualsiasi risoluzione):
background: url(../grafica/bg_60.jpg) repeat-y 60% 0;
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Permessi di invio
Rispondi quotando