如何在数据增加时自动扩展宽度和高度

Question

我有一个带有<div>标签和CSS样式的jsp页面。实际上我给了<div>标签宽度，例如300px和高度，例如100px。但是当从数据库中获取大量数据时，我提到的宽度和高度被超出，并且溢出或与其他<div>标签合并。我会展示一张图片以便更好地理解。

在下图中，您可以看到数据的某些部分覆盖了其他部分数据，而某些部分正在越过边界。所以我的问题是如果有大量数据，如何自动增加字段的宽度和高度，以免它被碰撞或覆盖。
我使用的代码如下所示。

 #div7{
            border-left: 1px solid black;
            border-bottom: 1px solid black;
            width: 278px;
            height: 40px;
            float: left;
            display: inline-block;
            }
            #div8{
            border-bottom: 1px solid black;
            border-left: 1px solid black;
            border-right: 1px solid black;
            display: inline-block;
            width: 328px;
            float: left;
            height: 40px;
            }

<div id="div7">&nbspWorks Address: Same As Above</div>
<div id="div8">&nbspTerms Of Delivery :- <%= termsofdelivery%><br/>
               &nbspAttention :- <%= attention %></div>

Answer 1

您可以将宽度和高度设置为自动，

#id-of-element{

         width:auto;
         height:auto;

}

或者如果您需要将它们固定在一定宽度。您可以将两个容器设置为特定百分比。

#div1{

    width:50%;

}

#div2{

     width:50%;
}

Answer 2

或者你可以尝试做出回应。

#id-of-element{
         width:100%;
         height:auto;
}

Answer 3

已使用<table>代码并已width="100%"和work-break:break-all。我的问题已解决