Ich habe eine Div, die mit gestylt istoverflow-x: hidden, aber ich stelle fest, dass der Benutzer, wenn sich ein breiteres Div darin befindet, das Text enthält, immer noch mit der Maus zur Seite ziehen kann, um den ausgeblendeten Text anzuzeigen.

Ich möchte das verhindern und den Text wirklich verbergen. Diese Jsfiddle sollte zeigen, was ich meine:http://jsfiddle.net/YzsGF/11/ oder hier ist der Code:

<code><div id="outer">
   <div id="inner">
       How can I truly hide the text beyond the margin?
    </div>
</div>
#outer { 
    width: 150px; 
    height: 300px; 
    overflow-x: hidden;
    border: 1px solid black;
}
#inner { 
    width: 300px;
    overflow-x: hidden;
}
</code>

Kann ich verhindern, dass der Benutzer den verborgenen Text sieht?

UPDATE: Ich brauche overflow-y um zu funktionieren: es ist in Ordnung, dass overflow-x nur CSS3 ist. Es kann hilfreich sein, das reale Szenario zu erklären:

Ich habe ein inneres Div mit fester Breite, aber unbekannter Länge.Wenn es kurz genug ist, um ohne y-Bildlaufleiste in das äußere Div zu passen, ist alles in Ordnung.Wenn das innere Div lang genug wird, damit das äußere Div eine Y-Bildlaufleiste benötigt, wird eines angezeigt, schneidet jedoch einen Teil des Inhalts des inneren Divs für die rechte Hand ab. Das ist auch in Ordnung (ich habe absichtlich ein wenig rechts aufgefüllt), aber was nicht in Ordnung ist, ist, dass der Benutzer den Text auswählen und zur Seite ziehen kann, wodurch das leere rechts aufgefüllte Feld sichtbar wird und ein Teil des Texts auf der linken Seite ausgeblendet wird.

Irgendwelche Lösungen?