Change the width of a frame according to the width of the other elements

Question

I have an div#in and I want the width of my iFrame to fill the rest of the div#di space if the width of the div#in changes Friends, how can I do this?

 #di{ display: flex; border:1px solid red; } #in{ display: block; border:1px solid blue; height: 56px; width: 50px; resize: both; overflow: auto; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="di"> <div id="in">test by change witdh</div> <iframe src="https://www.bing.com"></iframe> </div>

Answer 1

Use this CSS:

#myIFrame {
  position: relative;   
  width: 100%;
}

Where #myIFrame is an id that i gave to your frame.