width of iframe in grid

Giganews Newsgroups
Subject: width of iframe in grid
Posted by:  Andrew Poulos (ap_pr…@hotmail.com)
Date: Mon, 15 Jul 2019

I have this grid

#floor {
  position: absolute;
  left: 0;
  right: 0;
  top: 100px;
  bottom: 100px;
  display: grid;
  grid-template-columns: 180px minmax(auto, 640px) 385px;
  grid-column-gap: 2px;
}

on this HTML

<div id="floor">
  <div id="A"></div>
  <iframe id="B" src="...">
  <div id="C"></div>
</div>

A and C have a fixed width

B, the iframe, is centred between A and C.
If the browser window is very wide B is not to go larger than 640 px.
If the browser window is too small to accommodate B at 640 px then B
should get a scroll bar.

Alas I can't seem to get B to honour the width set in
grid-template-columns. What the code above gives me are grid areas of
the correct size but with a iframe that stays at 300 x 150.

How can I get the iframe to respond appropriately?

Andrew Poulos

Replies