title: Using iframe inside tab
body: <p>I have tab html element each tab contains iframe element.</p>
  
  <p>Here is code:</p>
  
  <pre><code>&lt;ul class="nav nav-tabs" id="myTab"&gt;
      &lt;li class="active"&gt;&lt;a data-target="#home" data-toggle="tab"&gt;BBC&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="#profile" data-toggle="tab"&gt;CNN&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="#messages" data-toggle="tab"&gt;Sky news&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;div class="tab-content"&gt;
      &lt;div class="tab-pane active" id="home"&gt;
          &lt;iframe src="http://www.bbc.com/" height="500px" width="100%" /&gt; 
      &lt;/div&gt;
      &lt;div class="tab-pane" id="profile"&gt;
          &lt;iframe src="http://edition.cnn.com/" height="500px" width="100%" /&gt;
      &lt;/div&gt;
      &lt;div class="tab-pane" id="messages"&gt;
          &lt;iframe src="http://news.sky.com/" height="500px" width="100%" /&gt;    
      &lt;/div&gt;           
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is working <a href="http://jsfiddle.net/xFW8t/2293/" rel="nofollow noreferrer">jsfiddle</a>.</p>
  
  <p>But the problem that tab element not works properly when I change between tabs.
  Any idea why it's not working when I try to change between tabs? </p>