jquery - html/css3/jquery のスクロール可能領域を削除する

Question

(jquery を使用して) 幅を 0 から 0 より大きい値に変更して段落を表示すると、私の Web サイトはコンテンツのないスクロール可能な領域をすべて作成します。

スムーズなトランジションを使用しました。これにより、段落の幅が消えるまでどんどん小さくなりますが、完全に消える前の最後の瞬間に、段落のすべての単語が単語の大きな列になります。最終的に消えると、何もない大きなスクロール可能な領域が残ります。

この無駄なスペースを削除できません。これを修正する方法はありますか?

この無駄なスペースがサイトを台無しにしないようにするには、css ファイルまたは jquery ファイルに何を追加すればよいか知りたいだけです。

コードは次のとおりです。

html:

<article id="abms">
            <p>
                Mauris vulputate lorem ac nibh rhoncus, eu mattis lorem mattis. Maecenas metus dui, rhoncus eget erat quis, vehicula luctus justo. Aenean vel porta est, tristique mollis metus. Mauris gravida diam sit amet tellus pellentesque hendrerit. Maecenas ut suscipit metus. Nunc vel volutpat est, porta sodales nibh. Pellentesque varius ac massa nec varius.
                Mauris vulputate lorem ac nibh rhoncus, eu mattis lorem mattis. Maecenas metus dui, rhoncus eget erat quis, vehicula luctus justo. Aenean vel porta est, tristique mollis metus. Mauris gravida diam sit amet tellus pellentesque hendrerit. Maecenas ut suscipit metus. Nunc vel volutpat est, porta sodales nibh. Pellentesque varius ac massa nec varius.
            </p>
        </article>

CSS:

#abms
    {
        overflow: hidden;
        width:0px;
        text-align: justify;
        text-indent: 60px;
        background: rgba(255,255,255,0.2);
        margin: 0% 2% 2% 2%;
        border-radius: 1em;
    }

jquery:

$(document).on("ready",inicio);

function inicio()
    {
        $("#Alb").on("click",mov1);
        $("#Nos").on("click",mov2);
        $("#Us").fadeIn("slow");
        $("#hfi").fadeIn("slow");
    };

function mov1()
    {
        var hide =
            {
                margin:0,
                padding:0,
                overflow:"hidden",
                width:0
            };
        var show =
            {
                width:"42%",
                overflow:"visible",
                padding: "0% 1% 0% 1%"
            };

        $("#Us").css(hide);
        $("#abms").css(show);
    }

function mov2 ()
    {
        var hide =
            {
                margin:0,
                padding:0,
                overflow:"hidden",
                width:0
            };
        var show =
            {
                overflow:"visible",
                margin: "0% 2% 2% 2%",
                padding: "0.05% 2% 0.05% 2%",
                width:"40%"
            };
        $("#abms").css(hide);
        $("#Us").css(show);
    }

必要ないので、完全なコードは入れませんでした。