Ändern der Farbe des gesamten div nicht nur das Element

Ich versuche, das zweite Element einen grauen Hintergrund haben, aber wenn ich den Stil zum div hinzufügen es nur die Hintergrundfarbe auf das kleine span-Element. Ändern der Farbe des gesamten div nicht nur das Element

<div class="container-fluid row"> 
<div class="col-xs-3 col-lg-3 small-margin-top" style="background-color: #e4e4e4"> 
    <p><i class="fa fa-wrench" aria-hidden="true" style="font-size: 26px;"></i> <strong>The Architect:</strong></p> 
</div> 
<div class="col-xs-9 col-lg-9 small-margin-top" style="background-color: #e4e4e4"> 
    <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. enim ad minim veniam, 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span> 
</div>

Quelle

2017-06-20 rycekrispies

Ich wähle diese Frage zu schließen, wie Off-Topic, da die Fragesteller Staaten in einer Antwort (eigentlich ein Kommentar), dass er die CSS zu falschem Elemente machen die Frage keinen Wert angewandt . – Rob

die Hintergrundfarbe der Zeile Nehmen, nicht die Spalten. Die Spaltenhöhen sind nur so groß wie der Inhalt, deshalb ist die erste Spalte kurz.

Quelle

2017-06-20 13:08:36

Ich habe den Stil auf das falsche div angewendet. Es sollte auf die "Container-Fluid-Reihe" div angewendet werden.

Quelle

2017-06-20 13:09:07 rycekrispies

Sie müssen die gesamte Zeile Hintergrundfarbe setzen:

<div class="container-fluid row" style="background-color:#e4e4e4"> 
    .....

Quelle

2017-06-20 13:10:57

Wie ich verstehe Sie das gesamte Element grau gefärbt haben wollen. Warum wenden Sie die Hintergrundfarbe nicht auf das Zeilenelement an?

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="container-fluid row"> 
 
<div class="col-xs-3 col-lg-3 small-margin-top" style="background-color: #e4e4e4"> 
 
    <p><i class="fa fa-wrench" aria-hidden="true" style="font-size: 26px;"></i> <strong>Not how you want it.</strong></p> 
 
</div> 
 
<div class="col-xs-9 col-lg-9 small-margin-top" style="background-color: #e4e4e4"> 
 
    <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. enim ad minim veniam, 
 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span> 
 
</div> 
 
<div> t </div> 
 
<div class="container-fluid row" style="background-color: #e4e4e4"> 
 
<div class="col-xs-3 col-lg-3 small-margin-top" > 
 
    <p><i class="fa fa-wrench" aria-hidden="true" style="font-size: 26px;"></i> <strong>How you want it.</strong></p> 
 
</div> 
 
<div class="col-xs-9 col-lg-9 small-margin-top"> 
 
    <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. enim ad minim veniam, 
 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span> 
 
</div>

Quelle

2017-06-20 13:13:25 kacase

Ändern der Farbe des gesamten div nicht nur das Element

Antwort

Verwandte Themen