DocDocDocDocDocDoc

Why the Google Docs console hack is the wrong way to get two-page view

The hack is clever as a visual experiment, but it only repaints Google Docs. It does not change the editor model underneath, which is why the layout can look right while editing behavior still feels wrong.

That is why the trick is so seductive and so misleading at the same time. It solves the visual complaint first, which makes it feel clever, but it leaves the hard part untouched: how the editor behaves when you actually type, select, comment, and move through the document.

This no longer works in current Chrome and Google Docs

Google Docs now sends a Content Security Policy that requires Trusted Types, so the bookmarklet's attempt to write toinnerHTML is blocked. In current Chrome you will see errors like "This document requires TrustedHTML assignment" and "Failed to set the 'innerHTML' property on 'Element'".

That is a browser-and-Docs change, not a typo in the snippet. The page is now enforcing a safer DOM policy, so the old DOM overwrite never even gets to apply.

Even when this did work, it only changed the layout. It was useful for looking at the document, not for making Google Docs a better editor.

Before and after the console hack

Google Docs before and after the console hack, showing the visual transformation
The image makes the problem obvious: the screen changes first, but the editing model does not.
FeatureConsole hackDocDocDoc
Uses supported editor behavior
Keeps cursor and comment placement predictable
Survives Google UI changes without breaking
Feels like a product instead of a script

Skip brittle hacks. Open the same Google Doc in a stable side-by-side editor designed for daily writing.

You may have seen the browser-console trick that forces Google Docs into a pseudo two-page layout. On first glance it looks useful: the pages appear side by side, and a wide monitor feels less wasted.

That visual impression is the whole trick. It is not a real editing mode, and it is not a proper solution. It is a quick DOM override that happens to make the screen look different.

How the hack works

The original Coderwall post by Jeremy on Coderwall describes the trick as a simple CSS tweak: make the page containers fill the width, float the pages left, and force the layout into a fake two-column view.

(function(d,t,z,s) {
s = d.createElement(t);
s.innerHTML = z+'-outer{left:0px !important;}'+z+'-outer,'+z+'-inner{width:100% !important;}.kix-page{float:left; width:48% !important;}';
d.getElementsByTagName(t)[0].parentNode.appendChild(s);
})(document, 'style', '.kix-zoomdocumentplugin');

The original write-up is by Jeremy on Coderwall, and the bookmarklet version is linked from that post.

In other words, the hack is mostly a style override. It does not teach Google Docs to edit differently. It just persuades the browser to paint the interface in a way that looks more like two pages.

Why the right page feels unreliable

Google Docs still computes caret placement, hit testing, selection, and comments around its original layout model. The hack only repaints where pages appear on screen, so the visual result and the editing model drift apart.

Why it is not the proper way

The hack gives you a visual result that feels clever for a minute, but a real writing workflow has to survive everyday use. You need cursor stability, predictable selection, comments that land where they should, and a layout that stays understandable after the tenth edit of the day.

The console trick fails that test because it is not a product feature. It is a DOM manipulation. Once you treat it like a workflow, the weak points show up immediately.

Why DocDocDoc is different

  • Layout and editing are built together: the side-by-side view is not a paint-over of docs.google.com.
  • It is actually editable side by side: you do not get the left-page-only caveat that often shows up with CSS hacks.
  • It stays closer to the supported path: documents sync through official Google APIs instead of relying on internal DOM assumptions.
  • It adds useful extras: native dark mode, column-strip style width usage, and LaTeX rendering workflows.

When the hack is still useful

If you only need a quick read-only demo on your own machine, the hack can be fun to try. But for day-to-day writing, revision, or collaboration, a layout-native workflow is the safer choice.

That is the line to keep in mind: fun demo, bad habit. If you are trying to actually work, you should not rely on a trick that can be blocked outright by Trusted Types, or that could stop behaving the moment Google changes a class name or reflows the editor again.

The problem is not only fragility. It is also trust. A writing workflow has to feel boring in the best possible way. The moment a layout trick makes you hesitate before clicking or selecting text, it has already crossed the line from useful into distracting.

What the real layout looks like

This is the usable version: the document stays readable and editable instead of being repainted by a script.

Bottom line

The console trick is a clever demo, not a dependable editing surface. If you want side-by-side Google Docs work that you can trust every day, use DocDocDoc instead.

The fast answer

If you are curious, try the hack once as a visual experiment. If you are trying to write, revise, or collaborate, stop there. A trick that only changes the paint layer is never going to be the proper answer for a live document.

The better question is not whether the hack can make the screen look different. The better question is whether it helps you finish the document. In practice, the answer is no. It was only ever useful for viewing, not for real editing.

What people are actually chasing

Most people who search for this hack are not really looking for CSS. They are looking for relief from the single-page feeling of Google Docs. They want the page to look wider, the next page to stay in sight, and the whole editing process to feel less cramped.

That is exactly why the hack attracts attention. It seems to answer the real complaint. But because it only changes the visual layer, it cannot deliver the stability that a daily writing workflow needs.

References and further reading

Try the stable side-by-side workflow

Open a Google Doc in DocDocDoc and edit in a true wide-layout workspace designed for writing, not a fragile CSS hack.