How to remove the border from an iframe embedded in web app? An example of the iframe is:
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22myURL%22%20width%3D%22300%22%20height%3D%22300%22%3EBrowser%20%09%09%09not%20compatible.%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/] [ad type=”banner”]Add the frameBorder attribute (note the capital ‘B’).
So it would look like:
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22myURL%22%20width%3D%22300%22%20height%3D%22300%22%20frameBorder%3D%220%22%3EBrowser%20not%20compatible.%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]You have to set the frameBorder attribute with a capital B.
[pastacode lang=”markup” manual=”%3Ciframe%20frameBorder%3D%220%22%20%3E%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]In addition to adding the frameBorder attribute you might want to consider setting the scrolling attribute to “no” to prevent scrollbars from appearing.
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22myURL%22%20width%3D%22300%22%20height%3D%22300%22%20frameBorder%3D%220%22%20scrolling%3D%22no%22%3EBrowser%20not%20compatible.%20%3C%2Fiframe%20%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]Using the “border” CSS attribute works as well:
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22wikitest.html%22%20style%3D%22width%3A%20100%25%3B%20height%3A%20400px%3B%20border%3A0%22%3E%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]Note CSS border property does not achieve the desired results in IE6, 7 or 8.
For browser specific issues also add frameborder=”0″ hspace=”0″ vspace=”0″ marginheight=”0″ marginwidth=”0″ according to Dreamweaver:
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22wikitest.html%22%20name%3D%22banner%22%20width%3D%22300%22%20marginwidth%3D%220%22%20height%3D%22300%22%20marginheight%3D%220%22%20align%3D%22top%22%20scrolling%3D%22No%22%20frameborder%3D%220%22%20hspace%3D%220%22%20vspace%3D%220%22%3EBrowser%20not%20compatible.%20%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/] [ad type=”banner”]If the doctype of the page we are placing the iframe on is HTML5 then we can use the seamless attribute like:
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22…%22%20seamless%3D%22seamless%22%3E%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]Add the frameBorder attribute (Capital ‘B’).
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22myURL%22%20width%3D%22300%22%20height%3D%22300%22%20frameBorder%3D%220%22%3EBrowser%20not%20compatible.%20%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]Add the frameBorder attribute. It’s case-sensitive
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22iframe.php%22%20width%3D%22300%22%20height%3D%22300%22%20frameBorder%3D%220%22%20scrolling%3D%22no%22%3EBrowser%20not%20compatible%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]Add the frameBorder attribute below to the iFrame tag
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22http%3A%2F%2Fgoogle.com%22%20frameBorder%3D%220%22%3E%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]In your stylesheet add
[pastacode lang=”css” manual=”%7B%0A%20%20padding%3A0px%3B%0A%20%20margin%3A0px%3B%0A%20%20border%3A%200px%0A%0A%7D%0A” message=”Css Code” highlight=”” provider=”manual”/] [ad type=”banner”]Style property can be used For HTML5 if we want to remove the border of the frame or anything that can use the style property. as given below
[pastacode lang=”markup” manual=”%3Ciframe%20src%3D%22demo.htm%22%20style%3D%22border%3Anone%3B%22%3E%3C%2Fiframe%3E%0A” message=”Html Code” highlight=”” provider=”manual”/]