Loading site with getElementById into a div not taking 100% of width

Question

I'm building a site with bootstrap and I'm loading another site inside my page with javascript:

<div id ="content"></div>
<script>
function myFunction() {
document.getElementById("content").innerHTML='<object type="text/html" data="1.html" ></object>';
}
<script>

it's working just like I want to except the content is not taking 100% of the div, I thought I could fix it with css but it does nothing:

#content{
    margin: 0 auto;
    width:100%; /*it changes the size of the div but not the content*/
    background: red;
    height: 100%;
}

Here's a pic of what's happening, in the original 1.html the panels take 100% of the document.

Answer 1

you can add this in your css

#content object{
   width: 100%;
}