DIV定位，內容總是溢出

My Problem With margin-bottom 隨着下邊距 DIV定位，內容總是溢出

#txtmiddle { 
 
    min-height: 80px; 
 
    border: 1px solid #e0e0e0; 
 
    background-color: rgba(234, 234, 234, 0.7); 
 
    margin-top: 5px; 
 
    opacity: 0.7; 
 
    filter: alpha(opacity=70); 
 
    padding-top: 2%; 
 
    padding-right: 2%; 
 
    padding-bottom: 4%; 
 
    padding-left: 2%; 
 
    border-radius: 15px; 
 
    position: relative; 
 
} 
 
#midcontentimgright { 
 
    float: right; 
 
    margin-top: 10px; 
 
    margin-right: 10px; 
 
    border-radius: 50px; 
 
    max-width: 25%; 
 
    max-height: 100px; 
 
    position: relative; 
 
}

<div id="middlewrapper"> 
 
    <div id="txtmiddle" class="content6">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut</div> 
 
    <div id="txtmiddle" class="content7">Lorem ipsum <a id="mapa" href="map.htm">KARTE</a> 
 
    <img src="/MapAusschnitt.png" id="midcontentimgright" class="4"> 
 
    </div> 
 
    <div id="txtmiddle" class="content7">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod WERDEN SIE</div> 
 
</div>

它真的很難讓我明白，定位......我只是不希望任何溢出，一切都應該是div元素裏面....

來源

2015-07-20 UdSSR

有幾件事情要解決這裏可能會幫助你。

如果沒有JSfiddle和原始圖像，我無法告訴您邊距需要更改多少，但看起來您的img標籤的margin-top太大。否則，如果您在div的圖像頂部查找該空間，則應更改#txtmiddle的CSS的height。通過明確定義的元素的height在CSS，你能避免在其中img標籤未包含在div內的情況。其次，在你的代碼片段中你有3個div，其中id="txtmiddle"，也許這應該是一個類，因爲ID標籤通常應該引用DOM中的一個唯一對象，而不是多個。這種變化將在CSS通過改變從#txtmiddle規則定義.txtmiddle，同樣擺脫對div標籤的id屬性和content*班後，把他們反映。

它也可能是有益的包裝其他專區內的img標籤和DIV設置爲特定高度。

希望給你的東西。

VielGlück！

來源

2015-07-20 16:14:14

Danke！啊，好的，然後我混合了id和班級，謝謝你的注意！關於這個問題：我的#txtmiddle是由min-height定義的，但沒有使用高度屬性..我希望內部元素的邊距能夠拉伸div（這就是我所期望的...） – UdSSR

不能修復它這些信息... – UdSSR

對'img'標籤使用id使'margin-top'小於'10px'，您不會看到重疊問題。這裏有一個的jsfiddle：[小提琴]（https://jsfiddle.net/vq5ebqx2/） –

DIV定位，內容總是溢出

回答

相關問題