Search code examples
jqueryhtmlcssgoogle-chromenicescroll

NiceScroll multiple scrolls


I have a bug on my website, I am making a dashboard and I'm using a left navigation type and a middle content. The bug is really annoying me because I can't fix it.

The left navigation uses a scroll and the content window uses a scoll, If i scroll above the left navigation activity feed the scrollbar ends up way out of position and I really want to fix this.

The link to my website where you can see the bug

HTML CODE

<ul id="NS-02">
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
        <li><div class="avatar-small"></div></li>
</ul>

CSS CODE

div.activity-feed {
    background-color: #35383f;
    width: 290px;
    height: 315px;
    position: absolute;
    bottom: 50px;
}
div.activity-header {
    font-size: 7pt;
    font-weight: 700;
    color: #969696;
    text-transform: uppercase;
    text-align: center;
    padding: 10px 0 0 0;
}
ul {
    width: 240px;
    height: 240px;
}
ul li {
    list-style: none;
    margin: 0;
    padding: 0;
}

Solution

  • First of all you have many mistakes in code.

    • <link/> as tags should be closed with />.

    • <meta> tag should be in section <html>

    • <html xmlns="http://www.w3.org/1999/xhtml xml:lang="sv" lang="sv">
      missing quotation marks.

    • You should use some reset css file for all browsers comaptibilty for example http://meyerweb.com/eric/tools/css/reset/

    Here's example created for you, not exact your code, becuase it has serious flaws, it's not worth to change it EXAMPLE

    You should learn basic before using plugins that's my private opinion.

    EDIT:

    Example is changed, add leftColumn with activity feed box on left and on right content with jquery height and width (left column - window width) the fastest way to create for you desire I guess.

    Peace,

    Simon