1
我有幾個框（只有一個在代碼片段中），每個框的內容都會有不同的數量，我希望它們自動調整大小以適應內容。目前內容已經溢出，並未包含在框中。我用過overflow：hidden;但這似乎沒有幫助。在div的外部顯示的內容
感謝
#leadership_elections_timeline {
background-color: rgba(92, 177, 255, 0.4);
padding: 0 10%;
position: relative;
display: block;
}
#leadership_elections_timeline .timeline_divider {
width: 100%;
}
#leadership_elections_timeline .timeline_divider > div {
width: 150px;
height: 90px;
border-right: 2px solid #000;
box-sizing: content-box;
}
#leadership_elections_timeline .timeline_object {
width: 100%;
position: relative;
}
#leadership_elections_timeline .timeline_object .elections_timeline_left {
width: 150px;
height: 185px;
float: left;
position: relative;
}
#leadership_elections_timeline .timeline_object .elections_timeline_left .date_circle {
background-color: #fff;
border: 6px solid #000;
width: 23px;
height: 23px;
border-radius: 50%;
position: absolute;
top: 30px;
right: -11.5px;
}
#leadership_elections_timeline .timeline_object .elections_timeline_left p {
padding: 5px;
border-top: 2px dashed #c62428;
color: #000;
position: absolute;
top: 41px;
right: 11px;
}
#leadership_elections_timeline .timeline_object .elections_timeline_right {
overflow: hidden;
border-left: 2px solid #000;
}
#leadership_elections_timeline .timeline_object .elections_timeline_right .elections_timeline_info {
width: 93%;
background-color: #fff;
margin: 0 auto;
border-radius: 15px;
max-height: 165px;
margin-bottom: 20px;
position: relative;
box-shadow: 5px 5px 0 #c62428;
}
#leadership_elections_timeline .timeline_object .elections_timeline_right .elections_timeline_info:after {
content: '';
width: 0;
height: 0;
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
border-right: 15px solid #fff;
position: absolute;
left: -15px;
top: 26px;
}<div id="leadership_elections_timeline">
\t <div class="timeline_divider"><div></div></div>
\t <div class="timeline_object">
\t \t <div class="elections_timeline_left">
\t \t \t <div class="date_circle"></div>
\t \t \t <p>17 Jan 2017</p>
\t \t </div>
\t \t <div class="elections_timeline_right">
\t \t \t <div class="elections_timeline_info">
\t \t \t \t <div class="timeline_details">
\t \t \t \t \t <h3>Nominations are now open!</h3>
\t \t \t \t \t <p>Take our quiz to see which role you'd be best suited to.</p>
\t \t \t \t \t <a href="/representation/elections" class="goButton">Nominate Yourself</a>
\t \t \t \t \t <p>Think you know someone who would make a great full-time officer? Follow the link to let us know, and we'll contact them to see if they've considered running.</p>
\t \t \t \t \t <a href="/representation/elections" class="goButton">Nominate a friend</a>
\t \t \t \t </div> \t \t \t \t
\t \t \t </div>
\t \t </div>
\t </div>
</div>