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은 흰색 테두리를 제거합니다.

오렌지색은 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을위한 div 태그 또는 위의 사업부 중 하나를) 그것의 원인이 될 수있는 "DIV"태그가 될 수 있으리라 생각 iframe을

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

을 포함하는 웹 페이지에서 좀 더 CSS를 포함했다.

출처

2013-04-30 nikobradshaw

테두리, * 패딩 * 및 여백, 공백 적 – James

@James 패딩 요소는 어디에 있습니까? – nikobradshaw

일부 html inspector 브라우저의 내장 도구를 사용하여 문제가있는 곳을 찾아야합니다. 나는 패딩과 여백을 제로 (또한 HTML 태그)로 설정하려고한다. iframe 태그에 클래스 속성이 설정되어 있습니까? CSS에서는 iframe 대신 .iframe을 사용하기 때문입니다. – filipko

답변 해 주셔서 감사합니다. @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은 흰색 테두리를 제거합니다.

답변

관련 문제