Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 18
  1. #1
    Utente di HTML.it L'avatar di JpHack
    Registrato dal
    Jun 2013
    Messaggi
    17

    Adattare Background a tutti i Display

    Ciao a tutti e grazie di avermi dato questo attimo di attenzione!
    Il mio problema è lo sfondo superiore che ho attribuito al container così:

    codice:
    #container { 
    width: 100%; 
    background: url("../images/body_top.jpg")repeat-x top left;
    margin: 0 auto; 
    }
    Come potete vedere dal codice l'immagine si ripete in x ...
    Voi vi chiederete ma qual è quindi il problema?
    Vedete voi stessi, questa è l'immagine
    CLICCA QUI PER VEDERLA che come dicevo viene ripetuta all'interno di questo sito CLICCA QUI PER VEDERLO . Bene, ora provate a dimezzare la finestra del vostro browser e andate con lo scroller orizzontale il più a destra possibile... Come potete notare manca un pezzo di sfondo superiore che invece è perfetto se guardato a pagina intera. Accade la stessa cosa guardandolo da un iPad, Smarthphone e altri dispositivi con display piccolo...

    Come posso aggiustare il tutto??

  2. #2
    ci sono diverse opzioni in campo, la più semplice è:

    codice:
    background-size: cover;
    
    /* example */
    width:100%;
    height:100%;
    background: url(tua.jpg) center center no-repeat;
    background-size: cover ;
    Interactive Html/CSS/JS Playground | @webbeloz ( cip..cip! )
    Mechanics & Expert Tuning Fix Z3 Roadster Community

  3. #3
    Utente di HTML.it L'avatar di JpHack
    Registrato dal
    Jun 2013
    Messaggi
    17
    Il risultato non è quello che voglio... e andando a dimezzare la finestra c'è sempre lo stesso errore... Con questo metodo non si risolve NULLA e deforma solo l'immagine... Ma almeno hai capito cosa intendo fare? (Grazie comunque per l'interesse)

  4. #4
    probabile che nn abbia capito,
    io cmq con Safari, Chrome e FireFox non vedo il tuo problema:

    Bene, ora provate a dimezzare la finestra del vostro browser e andate con lo scroller orizzontale il più a destra possibile... Come potete notare manca un pezzo di sfondo superiore che invece è perfetto se guardato a pagina intera.
    Interactive Html/CSS/JS Playground | @webbeloz ( cip..cip! )
    Mechanics & Expert Tuning Fix Z3 Roadster Community

  5. #5
    Utente di HTML.it L'avatar di JpHack
    Registrato dal
    Jun 2013
    Messaggi
    17
    Comunque scusa se ti ho risposto in maniera aggressiva , non era mia intenzione...
    Io ho Chrome e me lo visualizza questo errore, è come se il div "container" si spostasse quando il display è più piccolo se vuoi ti faccio uno screenshot per vedere...

  6. #6
    macchè aggressivo

    sono io che e al primo colpo ho capito un'altra cosa...

    vai di shot, e vddiamo come lo vedi...
    Chrome aggiornato Last version?
    Interactive Html/CSS/JS Playground | @webbeloz ( cip..cip! )
    Mechanics & Expert Tuning Fix Z3 Roadster Community

  7. #7
    Utente di HTML.it L'avatar di JpHack
    Registrato dal
    Jun 2013
    Messaggi
    17
    Ecco a te, e grazie per la disponibilità! Vedi il verde è più corto quando si dovrebbe ripetere all'infinito...

  8. #8
    Fireox e Chrome aggionati io vedo OK.
    Interactive Html/CSS/JS Playground | @webbeloz ( cip..cip! )
    Mechanics & Expert Tuning Fix Z3 Roadster Community

  9. #9
    togli => margin: 0 auto;
    Interactive Html/CSS/JS Playground | @webbeloz ( cip..cip! )
    Mechanics & Expert Tuning Fix Z3 Roadster Community

  10. #10
    Utente di HTML.it L'avatar di JpHack
    Registrato dal
    Jun 2013
    Messaggi
    17
    Sono tutto aggiornato ora provo a togliere quello ...

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.