The body of a Visualforce Page is enclosed in a table cell, whose children won't respond to overflow without having a known width. But by setting a width you would lose the fluidity of the page. Catch 22!
Given this, I humbly recommend:
use sidebar="false"
so the page becomes a single-cell table, and
put table-layout: fixed
on the body table, so the remaining cell responds to overflow,
Overflow.page:
<apex:page sidebar="false">
<style>
table#bodyTable {
table-layout: fixed;
}
</style>
<div style="border:1px solid red; overflow: auto;">
extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content
extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content
extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content extremely wide content
</div>
</apex:page>
Usual caveat applies: messing with Salesforce markup is unsupported; it may change at any time.