pskordilakis / vuepress-plugin-tabs

Vuepress plugin - markdown custom container to display content in tabs
MIT License
57 stars 2 forks source link

Page scrolls down when switching tabs #21

Open jmaneyrol69 opened 4 years ago

jmaneyrol69 commented 4 years ago

When clicking on a tab to switch tabs, the page scrolls down:

Vuepress tab scrolls

Environment

Expected result

Page does not move when switching from one tab to the other.

Code example

::::: tabs

:::: tab "1.4.0 (latest)" HTTP/HTTPS and SOCKS5 proxy settings can be configured via gmsaas config command.

gmsaas config set proxy (http[s]|socks5)://host:port

For an authenticated proxy, credentials can be passed in the URL:

gmsaas config set proxy (http[s]|socks5)://user:password@host:port

::::

:::: tab "1.3.0" ::: geny-important SOCKS5 proxy is not supported with 1.3.0 :::

HTTP/HTTPS proxy settings can be configured via gmsaas config command.

gmsaas config set proxy http[s]://host:port

For an authenticated proxy, credentials can be passed in the URL:

gmsaas config set proxy http[s]://user:password@host:port

::::

:::::

jmaneyrol69 commented 4 years ago

No updates? Up @pskordilakis

joshua-schwartz commented 3 years ago

Having the same issue @pskordilakis

joshua-schwartz commented 3 years ago

Found a solution @jmaneyrol69. Add the following CSS to the index.styl file:

section.tabs-component-panel::before {
    content: '';
    display: block;
    position: relative;
    width: 0;
    height: 10em;
    margin-top: -10em;
}
jmaneyrol69 commented 3 years ago

Found a solution @jmaneyrol69. Add the following CSS to the index.styl file:

section.tabs-component-panel::before {
    content: '';
    display: block;
    position: relative;
    width: 0;
    height: 10em;
    margin-top: -10em;
}

Thanks for the trick, @joshua-schwartz, but this project seems more or less dead. I've switched to vuepress-plugin-element-tabs (https://github.com/superbiger/vuepress-plugin-tabs) which does not exhibit this issue.