[ Solved – 11 Answers ] HTML – Remove border from IFrame

PROBLEM :

How to remove the border from an iframe embedded in web app? An example of the iframe is:

<iframe src="myURL" width="300" height="300">Browser 			not compatible.</iframe>

SOLUTION 1:

Add the frameBorder attribute (note the capital ‘B’).

So it would look like:

<iframe src="myURL" width="300" height="300" frameBorder="0">Browser not compatible.</iframe>

SOLUTION 2:

You have to set the frameBorder attribute with a capital B.

<iframe frameBorder="0" ></iframe>

SOLUTION 3:

In addition to adding the frameBorder attribute you might want to consider setting the scrolling attribute to “no” to prevent scrollbars from appearing.

<iframe src="myURL" width="300" height="300" frameBorder="0" scrolling="no">Browser not compatible. </iframe >

SOLUTION 4:

Using the “border” CSS attribute works as well:

<iframe src="wikitest.html" style="width: 100%; height: 400px; border:0"></iframe>

Note CSS border property does not achieve the desired results in IE6, 7 or 8.

SOLUTION 5:

For browser specific issues also add frameborder=”0″ hspace=”0″ vspace=”0″ marginheight=”0″ marginwidth=”0″ according to Dreamweaver:

<iframe src="wikitest.html" name="banner" width="300" marginwidth="0" height="300" marginheight="0" align="top" scrolling="No" frameborder="0" hspace="0" vspace="0">Browser not compatible. </iframe>

SOLUTION 6:

If the doctype of the page we are placing the iframe on is HTML5 then we can use the seamless attribute like:

<iframe src="..." seamless="seamless"></iframe>

SOLUTION 7:

Add the frameBorder attribute (Capital ‘B’).

<iframe src="myURL" width="300" height="300" frameBorder="0">Browser not compatible. </iframe>

SOLUTION 8:

Add the frameBorder attribute. It’s case-sensitive

<iframe src="iframe.php" width="300" height="300" frameBorder="0" scrolling="no">Browser not compatible</iframe>

SOLUTION 9:

Add the frameBorder attribute below to the iFrame tag

<iframe src="http://google.com" frameBorder="0"></iframe>

SOLUTION 10:

In your stylesheet add

{
  padding:0px;
  margin:0px;
  border: 0px

}

SOLUTION 11:

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

<iframe src="demo.htm" style="border:none;"></iframe>