2017-03-24 14 views
0

As you can see 위젯 주위에는 1px 테두리가 있습니다. iOS에서만 나타납니다. 이것은 iframe이 있습니다이 SoundCloud 위젯 주위에 나타나는 1px 테두리를 제거하기 위해 할 수있는 일이 있습니까?

.widget { 
    ... 
    border: 1px solid #e5e5e5; 
    ... 
} 

: 나는 관리자에서이 문제를 일으키는 CSS 볼 수 있습니다 내가 CSS는 iframe에 다른 도메인에서 오는 요소에 영향을주지 수 있습니다 알고

<iframe src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/307068209&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true" scrolling="0" frameborder="0"></iframe> 

을하지만, 클라이언트가 나쁜 것처럼 보입니다. 이 문제를 일으키는 원인이 될 수 있습니까? 그렇지 않다면 이것을 제거 할 수있는 방법이 있습니까?

답변

0

은이 게시물에서 조언을 복용 결국 :

CSS: Inset shadow by parenting div over iframe

을 그리고이 나쁜 소년 추가 :

.iframe-wrapper:before{ 
    position: absolute; 
    content: ''; 
    top: 0; 
    left: 0; 
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, .4) inset; 
    z-index: 1; 
    width: 100%; 
    height: 100%; 
} 

충분히 국경을 숨 깁니다
0

전체 iframe의 가장 바깥 쪽 1 픽셀을 숨기거나 잘라낼 수 있지만 원하는 효과가 있거나 없을 수 있습니다. http://codepen.io/anon/pen/evKLMr

div { 
    overflow: hidden; 
    width:398px; 
    height:198px; 
} 

iframe { 
    position: relative; 
    top:-1px; 
    left:-1px; 
    width: 400px; 
    height: 200px; 
}