Come ripetere l'immagine di sfondo come blocco

Question

È possibile ripetere un'immagine di sfondo come blocco? Quando creo il div 100% di larghezza e setti l'altezza a 70px, questa immagine si ripete bene ma il problema dipende dalla larghezza della scatola, a volte metà dell'elemento si presenta e questo non ha alcun senso. Voglio che l'intera immagine si ripeta se c'è spazio se la ripetizione non finisce. È possibile?

#wrapper { 
 
    background-color: #E3E3E3; 
 
    position: relative; 
 
    padding: 55px 0 0 0; 
 
} 
 
#notepadTop { 
 
    display: block; 
 
    position: absolute; 
 
    top: -24px; 
 
    left: 0; 
 
    width: 100%; 
 
    height: 70px; 
 
    background: url('http://i.imgur.com/lbW0QX6.png') repeat; 
 
}

<div id="wrapper"> 
 
    <div id="notepadTop"> 
 

 
    </div> 
 
</div>

Questa è l'immagine

Answer 1

Prova ad aggiungere questo nel vostro css:

background-repeat: round

modo, si ha:

#notepadTop { 
    display: block; 
    position: absolute; 
    top: -24px; 
    left: 0; 
    width: 100%; 
    height: 70px; 
    background-image: url('http://i.imgur.com/lbW0QX6.png'); 
    background-repeat: round; 
} 

il valore round è una nuova opzione CSS3 quindi questo non funzionerà su IE8 e al di sotto (non dovrebbe essere preoccupare).

Answer 2

Se ho capito la tua domanda, sono alla ricerca di background-size: cover;