remove overflow for Pane.js about react-split-pane HOT 5 CLOSED

I thought that it was probably better to have 'overflow:auto' as a style the user could choose to add to a Pane - instead of it forced onto every Pane.

Hopefully you can add the same effect back by just adding this to your css:

.Pane {
    overflow: auto;
}

Also you can optionally specify a classname on a SplitPane, and the two Pane's contained in any SplitPane automatically have the classes 'Pane1' & 'Pane2'.

So you can then add the overflow by adding some css like this:

.my-split-pane > .Pane {
overflow: auto;
}

If it is just the top or bottom Pane that needs it, then either

.my-split-pane > .Pane1 {
or this

.my-split-pane > .Pane2 {
should target the correct pane...

If you have any problems with this then let me know...

from react-split-pane.

Done - thanks for letting me know. 👍

from react-split-pane.

Just tested it. Works great!

Here's a question for you about another issue: the splitter line appears to
be coming out of its container. Any suggestions as how to fix it?

[image: Inline image 1]

Thanks,
Ed

On Mon, Mar 28, 2016 at 6:19 PM, tomkp [email protected] wrote:

Done - thanks for letting me know. [image: 👍]

—
You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
#52 (comment)

from react-split-pane.

Hi - sorry, I can''t see the image, so I'm not sure of the exact problem you're having. Can you put together a simple example of the code that is exhibiting this?

from react-split-pane.

Hi,
there are two other problems when Pane is without overflow: 'auto' and content of the Pane is too long

1. SplitPane split="horizontal" has invisible Resizer until you hover it

2. SplitPane with prop split="horizontal" does not work right. Content of top and bottom Pane can overlap each other.

You can easily try it by adding long text to SplitPane divs:

    <SplitPane split="vertical" minSize="50" defaultSize="100" className="primary">
        <div>"PASTE REALY LONG TEXT HERE"</div>
        <SplitPane split="horizontal">
            <div>"PASTE REALY LONG TEXT HERE"</div>
            <div>"PASTE REALY LONG TEXT HERE"</div>
        </SplitPane>
    </SplitPane>

Jan

from react-split-pane.