← homeProgramming (Програмування)

The preview in the network tab after the Chrome update has become very small.

Temporary fix for the issue with the small Preview window in the Network tab of the Chrome browser (and Chrome-based browsers).

This content has been automatically translated from Ukrainian.
In the new versions of Google Chrome (on MacOS in my case), the Preview in the Network Tab is very small. The same problem exists in other browsers (Arc).
As a temporary solution - you need to overwrite the CSS styles for this window.
We will add width: 100%; and height 400% to the iframe with the class html-preview-frame.
The inspector works exactly as it does on other web pages.
ezgif-22124eff598adf.gif
I found a thread on Reddit with this problem. So I'm not the only one. The next step is to use some Chrome plugin and hardcode these styles.
UPD.
I found a way to overwrite styles after reloading the page.
  • Open Inspector (first level)
  • Go to Network Tab / Preview
  • Open the inspector inside the preview
  • Source / Overrides:
  • requestHTMLView.css -> Add styles
  • Collapse the second inspector (which inspects the first haha)
Screenshot 2025-06-05 at 18.50.53.png
And the main trick - this second inspector, which we used to inspect the first - should not be closed, but collapsed. Then the overrides will be applied :D
ezgif-2c1a6dac5e386f.gif

🔥 More posts

All posts
What is vibe coding?
Jul 25, '25 21:51

What is vibe coding?

Vibe coding is intuitive programming in tandem with AI: without strict rules, with music, inspira...

What is a brain stack?
Jul 28, '25 19:37

What is a brain stack?

Brain stack is a model that describes how the brain works in layers: from neurons to self-awarene...