等效的java window.pack（）在css

Question

我對css很新。我試圖創建一個圍繞<div>的邊框，我希望它被限制在div中的元素大小，並且動態調整大小，以便與可能在div中顯示或隱藏的對象的新對象成比例。

我曾嘗試搞border-radius:和em測量，但我沒有取得很大進展。我看過here和 here，但是在java中並沒有真正導致類似window.pack（）的東西。我正在使用CSS，JavaScript和jQuery。我不認爲這很重要，但html主要是通過ejs編寫的。

這是我目前有，但它只是一個框的網頁寬度：

{ 
border-style: solid; 
border-color: blue; 
border-radius: 1-4 length|%/1-4 length|%; 
} 

Answer 1

好吧，我想我知道你在問什麼。

你可能會看到的問題是，默認情況下，divs是display:block，這將導致它們跨越它們的容器（除非滿足某些條件，如顯式調整大小，絕對定位等）。

快速修復：爲了讓它們隨內容增長或縮小，您將不得不將它們設置爲display:inline-block;

你也應該研究CSS盒模型。 Here's a decent article to help with that

邊界生活在div的「外部」。 div（如果設置爲display：inline-block）將默認爲自動寬度（又名width: auto）和高度（height: auto），這會導致它隨着孩子的增長或縮小。既然邊界生活在div的外面，div正在增長和萎縮，那麼你就去。

略高一點，要在div內容和邊框之間添加填充，只需在CSS中設置填充：例如，padding: 3px。填充也「住在」div的外面，但在邊界之前。如果這是有道理的。

編輯此外，如果你不熟悉該工具：You might try playing with your HTML and CSS in something like JSFiddle。