如何修復div的大小，但保持它的響應

Question

我想做一個容器（一箱）誰包含信息，我想修復的大小，但我想使它的響應。看看這個圖片來了解一個好一點我想要做的事：

所以這是允許的： 同樣爲它確定的時刻： 錯了，它應該阻止大小

而且我曾嘗試下面的代碼：

.liContainer { 
 
    list-style-type: none; 
 
    border-style: solid; 
 
    margin-bottom: 5px; 
 
}

<li class="liContainer"> 
 
    <div> 
 
    <h3>Container 1</h3> 
 
    </div> 
 
    <div id="id"> 
 
    <span>90b5bb870feb5a1148e4f9042f87c957043b71d60dc91d743bccdc5a10c0f54f </span> 
 
    </div> 
 
    <div> 
 
    State:<span class="state">Running</span> 
 
    </div> 
 
</li>

Answer 1

添加word-break:break-all - 這使得行的任何兩個字母

請參見下面的演示之間打破：

.liContainer { 
 
    list-style-type: none; 
 
    border-style: solid; 
 
    margin-bottom: 5px; 
 
    word-break: break-all; 
 
}

<li class="liContainer"> 
 
    <div> 
 
    <h3>Container 1</h3> 
 
    </div> 
 
    <div id="id"> 
 
    <span>90b5bb870feb5a1148e4f9042f87c957043b71d60dc91d743bccdc5a10c0f54f </span> 
 
    </div> 
 
    <div> 
 
    State:<span class="state">Running</span> 
 
    </div> 
 
</li>