iFrame擺脫白色接壤

這裏是一個截圖，以幫助解釋我在問什麼。 Orange is the iFrame total size. Green is the iFrame content size and the blue is the text (not visible in this screen shot) iFrame擺脫白色接壤

Orange是iFrame的總大小。綠色是iFrame內容的大小和藍色是文本（在這個屏幕截圖不可見）

正如你可以看到周圍的橙色有一個白色的邊框，將不會消失。我已經包含下面的代碼試圖擺脫它：

<iframe width="100%" height="60" frameBorder="0" src="http://iframeurl.html"></iframe>

，這是IFRAME網頁上的CSS：

body { 
    margin: 0; 
    margin-top: 0; 
}

正如你可以看到我得到了擺脫利潤率iFrame（從網頁的邊緣到邊緣）以及包含iFrame的網頁上的邊框設置爲「0」。

你可以看到不應該在那裏的白色（到左邊和頂部）的iFrame。我包括在包括內嵌框架

.iframe, object, embed{ 
    width: 100%; 
    height: auto; 
    border:none; 
}

我相信這可能是「格」的標籤可能會造成它（無論是對iFrame的div標籤或它上面的DIV）的網頁一些CSS。

來源

2013-04-30 nikobradshaw

邊框，*填充*和邊距，你的空白敵人。 – James 2013-04-30 19:27:54

@詹姆士填充元素去哪裏？ – nikobradshaw 2013-04-30 19:32:43

你應該嘗試使用一些html inspector瀏覽器內置工具來找出問題出在哪裏。我會嘗試設置填充和邊距爲零（也用於html標籤）。你有沒有爲你的iframe標籤設置class屬性？因爲在你的CSS中你使用的是.iframe（而不是iframe）。 – filipko 2013-04-30 19:35:04

感謝球員們的迴應！ @filipko我在iFrame造成它之前再次查看了檢查員和div標籤。正如@James所建議的那樣，我只是將「邊框，填充和邊距」更改爲0。

這裏是固定它的代碼：

.ui-content { 
padding-top: 0px; 
margin-top: 0; 
border-top: none; 
}

的.ui內容是我的iFrame前的股利。多謝你們！

來源

2013-04-30 19:40:50 nikobradshaw

iFrame擺脫白色接壤

回答

相關問題