html - Text stays out of the box

Question

I have two other boxes with the same code and the text stays inside but in the last box the text stays outside, if anybody could help.

HTML:

<div class="third">
    <div class="brooo">
        <img src="brooo.png" height="200" width="200" style="border: 1px solid black; margin-top: 20px; margin-left: 30px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);">
    </div>
    <div class="thirdd">
        <p>BUSINESSES</p><br>
        <p>Buy mega companies or small business such as gas stations, clothing stores, bars and more... <br><br>

            Employment rankings from 1 man jobs(taxi/gas station) to multi-level "businesses" that require CEO, VP(lieutenants), and standard employees. <br><br>

            Do you have what it takes to run a company that supplies the city with common commodities?</p>
    </div>

CSS:

.third {
    margin-top: 30px;
    background-color: #2F3030;
    border: 1px solid grey;
    height: 250px;
}

.thirdd {
    color:rgb(255, 255, 255);
}

标签： htmlcss

Answer 1

你的thirddiv 有这个属性：height: 250px.

容纳它所有的孩子是非常小的。

删除此属性，父 div 将扩展以包含它的子级。