父元素未设置宽高，子元素初始宽度较大，所以父元素有滚动条，当子元素缩小后希望重新计算父元素宽高

可以通过JavaScript来实现子元素缩小后重新计算父元素宽高的效果。具体实现方法如下：

1. 监听子元素的缩小事件，例如可以使用resize事件或者自定义事件。

2. 在事件处理函数中获取父元素和子元素的宽高，计算出子元素缩小后的宽度。

3. 设置子元素的宽度为计算出的宽度，并重新获取父元素和子元素的宽高。

4. 根据新的宽高值设置父元素的宽高，以达到重新计算的效果。

以下是一个示例代码：

<style>
  .parent {
    overflow: auto;
  }
  .child {
    width: 500px;
    height: 300px;
  }
</style>

<div class="parent">
  <div class="child"></div>
</div>

<script>
  const parent = document.querySelector('.parent');
  const child = document.querySelector('.child');

  // 监听子元素缩小事件
  child.addEventListener('resize', () => {
    // 计算出子元素缩小后的宽度
    const newWidth = child.offsetWidth / 2;

    // 设置子元素的宽度为计算出的宽度
    child.style.width = `${newWidth}px`;

    // 重新获取父元素和子元素的宽高
    const parentWidth = parent.offsetWidth;
    const parentHeight = parent.offsetHeight;
    const childWidth = child.offsetWidth;
    const childHeight = child.offsetHeight;

    // 根据新的宽高值设置父元素的宽高
    parent.style.width = `${childWidth > parentWidth ? childWidth : parentWidth}px`;
    parent.style.height = `${childHeight > parentHeight ? childHeight : parentHeight}px`;
  });
</script>

注意：在实际使用中，可能需要针对不同的浏览器进行兼容性处理，例如获取元素宽高的方法可能会有所不同。