<pre class = "prettyprint-override"> in fieldset doesn't respect the "overflow: auto" directive
This is a test case:
<!doctype html> <html> <body> <div style="margin: 0 auto; width: 950px; overflow: hidden;"> <div style="float: left; width: 660px"> <form><fieldset> <pre style="overflow: auto">Test test test Test test test Test test test Test test test Test test test Test test test Test test test Test test test </pre> </fieldset></form> </div> <div style="float: right; width: 260px"> Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. Lorem Ipsum. </div> </div> </body> </html> I want the code in <pre> show the scroll bar instead of overflow in the Lorem Ipsum sidebar. If it is in a <fieldset> (as in the example), it overflows.
If you remove the <form><fieldset> , it will no longer overflow, but it will also not show the scroll bar (the overflow text is just cropped).
Here is what I want:
- If the text in the
<pre>longer than the available width, it should not overflow in "Lorem Ipsum", and it should show the scroll bar, whether in the<fieldset>or not.
+4
1 answer
He submits to him, but in the context of his default behavior. Currently it does not have width , and the default behavior of <pre> is to have no width (but rather to expand to available space ... and its parent is ready to expand to accommodate it), so it is acting correctly.
If you want it to match, just give it the same width as the parent, for example:
<pre style="overflow: auto; width: 660px;"> +2