Come sbarazzarsi del bordo per un Iframe in IE8

Question

Sto creando una finestra di dialogo con un iframe all'interno, il problema è che il bordo continua a essere visualizzato in IE8, questo funziona perfettamente in qualsiasi altro browser.

Questo è quello che ho provato, ho anche provato border: none

$(d.dialog).find('#MyCoolDialogInner').html('<iframe src="/apex/EscalationForm?id={!Case.Id}" height="495" width="380" marginheight="0" marginwidth="0" frameborder="0"/>'); 

Grazie in anticipo

Answer 1

aggiungere l'attributo frameBorder (notare la capitale ‘B’).

Quindi sarebbe assomigliare:

<iframe frameBorder="0">Browser not compatible.</iframe> 

Answer 2

Hai provato impostarlo tramite CSS?

iframe { 
    border:0px none transparent !important; 
} 

Inoltre, questi sembrano funzionare anche - marginheight="0" marginwidth="0" frameborder="0". Tratto da this post on the same IE issue.

Answer 3

Prova questa:

<iframe frameborder="no" /> 

Answer 4

frameborder può essere un 1 o 0, non è sicuro "no" è un valore valido. Coda fornisce opzioni di valore valide durante la codifica e solo 1 e 0 sono disponibili per l'uso quando lo faccio al mio iframe.

Answer 5

Mi rendo conto che IE8 è una seccatura quando si tratta di iFRAMES. "Frameborder" è deprecato in HTML5, quindi mentre è l'opzione più semplice per IE8, questa non è una soluzione a lungo termine.

I bordi e le barre di scorrimento sono stati nascosti correttamente posizionando l'iFRAME all'interno di un contenitore. Il contenitore iFRAME stesso è collocato all'interno di un div per il posizionamento complessivo sulla pagina web. Lo stesso iFRAME è posizionato in modo assoluto e i margini negativi applicati a entrambi i lati superiore e sinistro per nascondere i bordi superiore e sinistro. La larghezza e l'altezza della iFRAME posizionata in modo assoluto devono essere codificate a oltre il 100% in modo che superi la dimensione padre fino al punto in cui i bordi destro e inferiore non sono visibili (anche le barre di scorrimento non sono visibili). Questa tecnica rende anche iFrame reattivo perché il contenitore iFRAME utilizza percentuali e il div che detiene il contenitore. Ovviamente il div padre di iFRAME deve essere impostato su overflow: hidden.

Ecco un esempio di codice:

/*THE PARENT DIV FOR THE iFRAME CONTAINER*/ 
    .calcontainer 
     { 
     width:100%; /*adjust iFrame shrinking here - if floating use percentage until no white space around image.*/ 
     max-width:200px;  
     margin:auto;  
     } 


    /*THE RELATIVE POSITIONED CONTAINER FOR THE iFRAME*/ 

    .calinside /*container for iFRAME - contents will size huge if the container is not contained and sized*/ 
     { 
     position:relative; /*causes this to be the parent for the absolute iFRAME*/ 
     padding-bottom: 100%; /* This is the aspect ratio width to height ratio*/ 
     height: 0; 
     overflow:hidden; /*hides the parts of the iFRAME that overflow due to negative margins and over 100% sizing*/  
     } 


/*THE ABSOLUTE POSITIONED iFRAME contents WITH NEGATIVE MARGINS AND OVER 100% SIZE IS CODED HERE. SEE THE NORMAL SETTINGS VERSUS THE IE8 SETTINGS AS MARKED. A SEPARATE CSS FILE IS NEEDED FOR IE8 WITH A CONDITIONAL STATEMENT IN THE HEAD OF YOUR HTML DOCUMENT/WEB PAGE*/ 

    .calinside iframe 
     { 
     position: absolute; 
     top: 0; 
     left: 0; 
     width: 100% !important;/*must expand to hide white space to the right and below. Hidden overflow by parent above*/ 
     height: 103% !important; /*must expand to hide white space to the right and below. Hidden overflow by parent above*/ 
     /*IE8*/top: -2%; 
     /*IE8*/left: -2%; 
     /*IE8*/width: 114% !important;/*For IE8 hides right border and scroll bar area that is white*/ 
     /*IE8*/height: 105% !important; /*hide white space and border below. Hidden overflow by parent above*/   
     }