verschachtelt div nicht die Breite der Eltern div füllen

Question

Vielleicht weil es spät ist und ich bin super müde, aber ich habe ein Problem, ein verschachtelt Div zu bekommen, um an der Unterseite des Elternteils div bleiben und auch die volle sein Breite innerhalb des übergeordneten Div-Auffüllens.

Die Website ist hier: http://www.ecoscapecabins.com/wp-2016/ Ich beziehe mich auf den Abschnitt mit den Kabinen. div class = es-cabin-pricing es füllt nicht das Eltern-Div wie der Inhalt oben tut.

<div class="mkd-ptfs-item"> 
      <div class="mkd-ptfs-item-image"> 
     <a href="http://www.ecoscapecabins.com/wp-2016/portfolio-item/cabin-1-features/"> 
           <img src="http://www.ecoscapecabins.com/wp-2016/wp-content/uploads/2016/10/cabin-1-362x263.jpg" alt="" width="362" height="263">       </a> 
    </div> 
    <div class="mkd-ptfs-item-content"> 
     <h4 class="mkd-ptfs-item-title"> 
     <a href="http://www.ecoscapecabins.com/wp-2016/portfolio-item/cabin-1-features/">CABIN 1 FEATURES</a> 
    </h4> 
    <div class="mkd-ptfs-item-excerpt-holder"> 
     <p></p><p>Large Cedar Wrap-around Deck • Fully Equipped Kitchenette • Private River Rock Shower • Flat Screen Satellite TV • Private Fire Pit • Queen Bed</p> 
    <div class="es-cabin-pricing"> 
    <div class="es-cabin-left">May – Sep<br> 
    <span class="es-price">$180/night</span></div> 
    <div class="es-cabin-right">Oct – Apr<br> 
    <span class="es-price">$130/night</span></div> 
    </div> 
    <div style="clear:both;"></div> 
    </div> 
</div> 
    </div> 

CSS =

.es-cabin-pricing { 
position: absolute; 
bottom: 0px; 
display: block; 
float: none; 
width: initial; 


    .es-cabin-left { 
width: 45%; 
position: relative; 
margin-bottom: 20px; 
float: left; 
display: block; 


    .es-cabin-right { 
width: 45%; 
margin-left: 10px; 
position: relative; 
margin-bottom: 20px; 
float: right; 
display: block; 

Dies ist, wie ich es mit den Daten/Preise am Boden aussehen soll (ich kann nicht eine bestimmte Breite obwohl zwingen, weil sie zu skalieren, dass Deshalb brauche ich das es-cabin-pricing div um nur die Breite des Elternteils zu füllen:

Danke für die Hilfe.

Answer 1

Try this:

.mkd-ptfs-item-content { 
    padding: 0 25px 20px; 
    min-height: 230px; 
    position: relative; 
} 

.es-cabin-pricing { 
    position: absolute; 
    bottom: 0px; 
    left: 25px; 
    right: 25px; 
} 

Answer 2

unten Stile hinzufügen, um es zu beheben ....

.es-cabin-pricing { 
    width: 100%; 
    left: 0; 
} 

.mkd-ptfs-item-content { 
    position: relative; 
} 

, wenn Sie Position absolute verwenden, wird es nicht Breite 100% verwenden, es sei denn gegeben und die Position relativ gegeben, um Klasse es-cabin-pricing nehmen Position und Breite bezogen auf Klasse mkd-ptfs-item-content