Ciao a tutti, intanto mi presento, non sono sono nuovo nel forum ma e' tantissimo che non lavoro piu in css a causa del mio vero lavoro purtroppo (e mi sono quindi dimenticato quel poco che sapevo).
Avrei una richiesta che mi tartassa e che non riesco a risolvere:
ho bisogno di fare un layout con un'immagine di background 1000x620 px sempre centrata nel browser e poi sviluppare il sito dentro di essa. Ecco per questo ho realizzato cio:
CSS:
HTML:codice:#container { width: 1000px; /*here the exact size of the background image*/ height: 620px; /*here the exact size of the background image*/ background: url(../img/website_bg_bw.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .centered { position: absolute; margin: -310px 0 0 -500px; top: 50%; left: 50%; }
Ecco, in teoria va bene perche' mi ritrovo ciao dentro l'immagine di background ed e' fantastico.codice:<body> <div id="container" class="centered"> ciao </div> </body>
Il punto pero e' che a me non va bene del tutto, perche sul mobile l'immagine viene tagliata. Mi spiego meglio: se voi prendete il vostro browser con questa configurazione e lo restringete tanto dall'angolo in basso dx verso l'altro a sx, notate che la background image entra nel bordo in alto e a sinistra e finisce fuori dalla visuale. Io invece ho bisogno di farla fermare sul bordo appena lo tocca. allora ho trovato quest'altra soluzione:
CSS:
HTML:codice:#border{ height:100%; min-width: 1000px; min-height: 620px; border:1px solid #000; background: url(../img/website_bg_bw.jpg) no-repeat center center; }
Questa andrebbe ancora meglio (se restringete la background image si blocca sui bordi) ma non riesco a fare in modo di avere ciao all'interno dell'immagine e sviluppare quindi il sito dentro quella background image. Ho provato in tutti i modi e maniere ma non riesco ad unire queste due soluzioni.codice:<body> <div id="border"> ciao </div> </body>
a) ci avete capito qualcosa nella mia spiegazione strampalata? (sorry)
b) avete una qualche soluzione in merito/suggerimento?
Vi ringrazio in anticipo
ciao ciao

Rispondi quotando