Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    immagine ripetuta a fondo pagina

    Ciao a tutti. Purtroppo non riesco ancora ad utilizzare la funzione di ricerca del forum, ma ho unrgenza di risolvere un problema con i css.
    Sto realizzando un sito web con la seguente struttura:

    <html>
    <head>
    </head>
    <body>
    <div id="container">
    <div id="header"></div>
    <div id="wrapper"><div id="content"></div></div>
    <div id="navigation"></div>
    <div id="footer"></div>
    </div>
    </body>
    </html>

    ho un'immagine di sfondo che si ripete in cima alla pagina, periò l'ho inserita come sfondo del tag <body>.

    ho un'immagine di sfondo per il tag <header> e una per il tag <footer> (il footer è posizionato in modo assoluto rispetto al <container> per consentirmi di averlo sempre in fondo alla pagina, sia se il contenuto è inferiore alle dimensioni della pagina del browser, sia se eccede l'area visibile e bisogna usare lo scroll per arrivare in fondo.

    PROBLEMA
    avrei bisogno di un'immagine di sfondo che si ripeta orizzontalmente, ma al fondo della pagina, dietro il footer, speculare a quella che ho sistemato in alto come sfondo del body. Come fare? Purtroppo ho riscontrato grosse discrepanze tra Explorer e gli altri browser (Firefox e Opera, per il momento) e non riesco a trovare il modo.



    Grazie mille a chi riuscirà a darmi qualche suggerimento utile.
    Ciao.

  2. #2
    Utente di HTML.it L'avatar di zoom
    Registrato dal
    Dec 2001
    Messaggi
    1,737
    mmm div esterno a container posizionato in modo assoluto bottom:0 non funziona?
    poi a quel div gli applichi lo sfondo..
    Chicco Ravaglia per sempre con noi!

  3. #3
    Ho provato.
    Nella struttura del sito esistono degli "extradiv" vuoti che ho sistemato fuori da <container>, proprio per poterli usare con posizionamento assoluto e inserendo dentro ciò che mi serve.
    Questa cosa funziona solo se, per esempio voglio sistemare questo extradiv in alto e utilizzarlo al posto del <body> per inserire, che so, una sfumatura orizzontale, nel caso in cui mi servisse mettere nel tag <body> un'altra immagine, fissa nella pagina (non so se mi sono spiegata...comunque, se il tag <body> ha già un suo sfondo posso usare l'escamotage dell'<extradiv> per ottenere l'immagine ripetuta IN ALTO).

    Purtroppo, volendo ottenere la stessa cosa però posizionata in basso (left:0 bottom:0), ho problemi con Firefox e Opera nel momento in cui cambia il contenuto della pagina e si allunga: l'immagine ripetuta "galleggia" a metà pagina... e non va affatto a ricoprire il fondo di questa.

    Forse dimentico qualche hack particolare... non so proprio dove sbattere la capoccia in questo momento.

    Grazie per il suggerimento comunque.

  4. #4

    e se avessi un contenitore del <container>?

    Ciao a tutti.
    Ho un suggerimento, ma non riesco a farlo funzionare a dovere.

    Mettiamo che subito dopo il tag <body>, invece di avere subito il tag <div="container"> io decida di inglobare il tutto dentro un ulteriore div che chiamerò "bodywrapper" e che avrà altezza e larghezza 100% (così mi toglierei il fastidio dello sfondo ripetuto in basso),
    a questo punto come faccio a fare in modo che "container" si allunghi fino in fondo alla pagina come faceva prima, anche quando il suo contenuto è più corto? Non riesco a far funzionare questa cosa in Firefox e Opera... se ci riuscissi avrei risolto i miei problemi.

    Vediamo se qualche genio riesce ad inventarsi una soluzione.

    Grazie ancora.

  5. #5

    trovata soluzione

    Ciao a tutti.
    Sono riuscita finalmente a trovare la soluzione ai miei problemi seguendo le indicazioni su questa pagina in spagnolo (premetto che non conosco lo spagnolo, ma ho capito il senso).
    La condivido con voi nella speranza che possa essere d'aiuto a chi si dovesse trovare ad avere il mio stesso problema:
    soluzione

    Ciao ciao, e alla prossima!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.