change the height of background-color - css

Question

I'm trying to change the height of background-color in class.
#myclass{
background-color: #FFF;
padding: 25px;
border: 1px solid #e1e1e1;
height:auto;
}
<div id="myclass">
<div class="col-md-4">image</div>
<div class="col-md-4">text</div>
<div class="col-md-4">button</div>
</div>
In CSS height:420px working but i don't want something like this

Answer 1

Sounds like you're having an issue with floating elements. As the .col-md-* elements are floated, your #myclass element has no height (thus no background will display). Bootstrap's .col-md-* elements are supposed to be wrapped in an element with a class of "row", and I believe this will solve your problems:
<div id="myclass" class="row">
<div class="col-md-4">...</div>
<div class="col-md-4">...</div>
<div class="col-md-4">...</div>
</div>
If that isn't an option, you'll need to add an element to clear the floats on those .col-md-4 elements:
<div id="myclass" class="row">
<div class="col-md-4">...</div>
...
<br style="clear: both">
</div>

Answer 2

Solution 1) If it is a solid background-color - you can add the background as a image
#myclass {
background-image:url('pathtoimage/background-image.png');
background-size: 100% 450px;
background-position: left top;
}
Solution 2)
Add a fake-background image/color by adding a div inside #myclass.
<div id="myclass">
<div class="fake-bg"></div>
<div class="col-md-4">image</div>
<div class="col-md-4">text</div>
<div class="col-md-4">button</div>
</div>
Add this to your css:
#myclass {
position:relative;
}
.fake-bg {
position:absolute;
left:0;
top:0;
width:100%;
height:450px;
z-index:-1;
}

Answer 3

.clearfix:before, .clearfix:after {
content: "";
display: table;
line-height: 0;
}
.clearfix:after {
clear: both;
}
please use this css and just put .clearfix with .ror class.
it would work defiantly