1

画面要素を適切にレンダリングするのに問題があります。問題はオーバーフロープロパティに関係していると思います。ブラウザをフルスクリーン（1080p）で表示しても問題ありませんが、ブラウザのサイズを小さくしてから下にスクロールすると、画面外の要素のスタイルが表示されなくなります。

編集[将来のリンク切れを防ぐためにリンクを削除しました]

    /* DEFAULT */

* {
    margin: 0px;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;    
}
@font-face {
    font-family: leela;
    src: url('leelawad_0.ttf');
}
html, body {
    height: 100%;
    background-color: rgb(255,255,255);
}
h1 {
    color: rgb(183,183,183);
    font-family: leela;
    font-size: 16px;
    font-weight: normal;
    text-transform: uppercase;
}
a {
    color: rgb(102,102,102);    
    text-decoration: none;  
}

/* ID */

#container {
    height: 100%;
    overflow-x: hidden;
    width: 100%;
}
#header {
    border: 1px solid rgb(153,153,153);
    border-top: 0px;
    background-color: rgb(255,255,255);
    padding: 8px;
    position: fixed;
    width: 100%;
    z-index: 3;
}
#quickSearch {
    border: 1px solid rgb(153,153,153);
    background-color: rgb(250,250,250);
    height: 30px;
    margin: 8px 8px 8px 8px;
}
    #quickSearch input {
        background-color: rgb(250,250,250);
        border: 0px;
        height: 28px;
        margin-left: 10px;
        margin-top: 0px;
        float: left;
    }
#naviContainer {
    float: left;
    width: 200px;
    border-right: 1px solid rgb(153,153,153);
    background-color: rgb(225,225,225);
    height: 100%;
}
#navigation {
    background-color: rgb(225,225,225);
    float: left;
    width: 200px;
    margin-top: 31px;
    position: relative;
    z-index: 2;
    height: 100%;
}
    #navigation ul {
        margin: 0px;
        padding: 0px;
        width: 200px;

    }
    #navigation li {
        display: block;
        list-style-type: none;
        -webkit-transition: all 0.25s ease-in-out;
        -moz-transition: all 0.25s ease-in-out;
        -o-transition: all 0.25s ease-in-out;
        transition: all 0.25s ease-in-out;
    }
    #navigation li:hover {
        background-color: rgb(173,173,173);
        -webkit-transition: all 0.25s ease-in-out;
        -moz-transition: all 0.25s ease-in-out;
        -o-transition: all 0.25s ease-in-out;
        transition: all 0.25s ease-in-out;
    }
    #navigation h1 {
        border-bottom: 1px dotted rgb(153,153,153);
        background-color: rgb(127,127,127);
        padding: 8px;
    }
    #navigation h1.fix {
        border-top: 1px dotted rgb(153,153,153);
    }
    #navigation ul li {
        border-bottom : 1px dotted rgb(153,153,153);
    }
    #navigation li a {
        display: block;
        padding: 8px;
    }
#contentContainer {
    margin-left: 201px;
    margin-top: 31px;
    position: relative;
}
#breadcrumbs {
    background-color: rgb(239,239,239);
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgb(153,153,153);
    padding: 8px;
    position: inherit;
}
    #breadcrumbs ul {
        display: inline;
        margin-left: 0px;
        padding: 0px;
    }
    #breadcrumbs li {
        display: inline;
    }
#content {
    padding: 8px;
    position: inherit;
}
/* CLASSES */

.divider {
    border-left: solid 1px rgb(102,102,102);
    margin: 0px 7px 0px 5px;;
}

どんな入力でも大歓迎です！

4

2 に答える 2

1

position：fixedを使用して追加してみてください（目立つように黄色にしました）：

#navigation {
    background-color: yellow;
    border-right: 1px solid #999999;
    border-top: 0 none;
    float: left;
    height: 100%;
    margin-top: 31px;
    position: fixed;
    width: 200px;
    z-index: 2;
}

[編集]2回目の試行で、高さを削除します。

#navigation {
    background-color: #E1E1E1;
    float: left;
    //height: 100%;
    margin-top: 31px;
    position: relative;
    width: 200px;
    z-index: 2;
}
于 2013-02-22T17:07:26.793 に答える
0

それは高さ以外の何物でもありませんでした：100％の問題

#naviContainerからheight：100％を削除すると、これが修正されます。

#navigation {
  background-color: #E1E1E1;
  float: left;
  min-height: 100%;
  margin-top: 31px;
  position: relative;
  width: 200px;
  z-index: 2;
}

#naviContainer {
  background-color: #E1E1E1;
  border-right: 1px solid #999999;
  float: left;
  min-height: 100%;  /* the fix */
  width: 200px;
}
于 2013-02-22T17:42:42.103 に答える