CSS：抑制子元素的負邊距

我有一個圍繞某些動態內容的父元素（例如div）。我希望父div在儘可能多的情況下完全包含子元素。CSS：抑制子元素的負邊距

一個問題是具有負邊距設置的子元素，這會導致子元素顯示在父元素之外（並且還會導致父元素不具有所需的大小）。

所以

是否有可能以抑制子元素的切緣陰性被應用到父（例如，而不必修改對孩子的方式）的任何CSS技巧。
失敗的是，有無論如何檢測通過JavaScript是否一個特定的元素有溢出內容？（？在哪個方向和內容滿溢什麼程度）

2011-09-25 UpTheCreek

你嘗試把一個班的家長，如：

.parentDiv > * { 
    margin:0 !important; 
}

要讓父母與所需的高度，你也需要設置一些css：

.parentDiv{ 
    overflow:hidden; 
    position:relative; 
    background:#DFE; 
    padding:5px; 
}

來源

2011-09-25 20:23:33 Mic

謝謝，我沒有試過 - 我會給它一個回去找回你。 – UpTheCreek

但是，一個問題是，我並不是真的想要影響孩子元素的積極利潤率。但我會看看我是否可以用這個做點什麼。 – UpTheCreek

有一個javascript方法來處理這個問題，但它肯定不像@ Mic的CSS解決方案那麼幹淨。我還沒有完全測試過這個，你可能需要爲各種填充/保證金調整添加一些支持，但如果JS解決方案是唯一的選擇，它會讓人開始。使用prototype.js（jQuery的是相似的，但普通的JavaScript將是非常有彈性的..）：

function checkOverflow (child) { 
    child = $(child); 
    if (child.descendants().any()) { 
    child.getElementsBySelector("> *").each(function(e) { 
     checkOverflow(e); 
    }); 
    } 

    var parent = child.up(); 

    var child_left = child.cumulativeOffset()['left'], child_top = child.cumulativeOffset()['top']; 
    var child_height = child.getDimensions()['height'], child_width = child.getDimensions()['width']; 

    var parent_left = parent.cumulativeOffset()['left'], parent_top = parent.cumulativeOffset()['top']; 
    var parent_height = parent.getDimensions()['height'], parent_width = parent.getDimensions()['width']; 

    if (child_top < parent_top) { 
    if (child_left < parent_left) { 
     // adjust element style here 
    } else if (child_left > parent_left + parent_width) { 
     // adjust element style here 
    } 
    } else if (child_top > parent_top + parent_height) { 
    if (child_left < parent_left) { 
     // adjust element style here 
    } else if (child_left > parent_left + parent_width) { 
     // adjust element style here 
    } 
    } 
}

我總的感覺，不過，是你只能這樣做，如果它不能被明確地通過做CSS。

來源

2011-09-25 20:40:35

感謝亞當 - 有趣的方法。我寧願使用CSS，但我有一種感覺，我不能用CSS單獨完成它，所以沿着這些線可能是必要的。 – UpTheCreek

哦，還有一個簡單的說明，這是使用prototype.js。 –

CSS：抑制子元素的負邊距

回答

相關問題