Einstellung zwei Hintergründe in css

Question

Ich habe ein Problem wth zwei Hintergrundeinstellung, hier ist es:

rightCol { 
    margin: 0pt; 
    padding: 20px; 
    background: #AF7A38 url('../images/stain2.png') no-repeat scroll right top; 
    -moz-background-clip: border; 
    -moz-background-origin: padding; 
    -moz-background-inline-policy: continuous; 
    float: right; 
    width: 770px; 
    min-height: 810px; 
    height: auto ! important; 
    -moz-border-radius: 20px; 
    -webkit-border-radius: 20px; behavior: url(PIE.htc); 
} 

Wie Sie sehen den Hintergrund legen rechts oben mit einem gewissen Breite und Höhe mit # AF7A38 Farbe Hintergrund für den Rest der Spalte, aber was ich tun möchte, ist, einen anderen Hintergrund statt Farbe zum Beispiel setzen diese Einstellung:

background: url('../images/background2.jpg') repeat scroll 0% 0%; 

den Rest der Säule statt Farbe zu füllen.

dank

Answer 1

Soweit ich weiß, können Sie nur einen Hintergrund pro Element verwenden. CSS3 ändert dies jedoch, wenn also CSS3 eine Option ist, würde ich diese Route gehen. Schau es dir an here.

Answer 2

Um zwei Hintergrundbilder zu verwenden, platzieren Sie die Hintergründe in zwei Elemente. Sie können dafür die Elemente html und body verwenden, wenn Sie sie möchten behind the entire page, oder fügen Sie ein leeres positioniertes sekundäres Element hinzu, um sie behind a sub-element zu platzieren.