自動開封CSSアコーディオンメニューを閉じる

Question

私はthisアコーディオンをメニューに使用していますが、自動的に開くパネルがあります。どのようにしてパネルを開くことができないのでしょうか？これは純粋なCSSメニューですが、なぜそれが自動的に開いているのかわかりません。

body {background: #e0e3ec url(http://netcribe.com/example/bgnoise_lg.jpg) repeat top left;} 

    .ac-container{ 
    width: 400px; 
    margin: 10px auto 30px auto; 
    } 

    .ac-container label{ 
     font-family: 'Arial Narrow', Arial, sans-serif; 
    padding: 5px 20px; 
    position: relative; 
    z-index: 20; 
    display: block; 
    height: 30px; 
    cursor: pointer; 
    color: #777; 
    text-shadow: 1px 1px 1px rgba(255,255,255,0.8); 
    line-height: 33px; 
    font-size: 19px; 
    background: -moz-linear-gradient(top, #ffffff 1%, #eaeaea 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#eaeaea)); 
    background: -webkit-linear-gradient(top, #ffffff 1%,#eaeaea 100%); 
    background: -o-linear-gradient(top, #ffffff 1%,#eaeaea 100%); 
    background: -ms-linear-gradient(top, #ffffff 1%,#eaeaea 100%); 
    background: linear-gradient(top, #ffffff 1%,#eaeaea 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eaeaea',GradientType=0); 
    box-shadow: 
     0px 0px 0px 1px rgba(155,155,155,0.3), 
     1px 0px 0px 0px rgba(255,255,255,0.9) inset, 
     0px 2px 2px rgba(0,0,0,0.1); 
} 
} 

    .ac-container label:hover{ 
     background: #fff; 
    } 

    .ac-container input:checked + label, 
    .ac-container input:checked + label:hover{ 
    background: #c6e1ec; 
    color: #3d7489; 
    text-shadow: 0px 1px 1px rgba(255,255,255, 0.6); 
    box-shadow: 
     0px 0px 0px 1px rgba(155,155,155,0.3), 
     0px 2px 2px rgba(0,0,0,0.1); 
} 

.ac-container label:hover:after, 
.ac-container input:checked + label:hover:after{ 
    content: ''; 
    position: absolute; 
    width: 24px; 
    height: 24px; 
    right: 13px; 
    top: 7px; 
    background: transparent url(http://netcribe.com/example/arrow_down.png) no-repeat center center; 
} 

.ac-container input:checked + label:hover:after { 
    background-image: url(http://netcribe.com/example/arrow_up.png); 
} 

.ac-container input{ 
    display: none; 
} 

.ac-container article{ 
    background: rgba(255, 255, 255, 0.5); 
    margin-top: -1px; 
    overflow: hidden; 
    height: 0px; 
    position: relative; 
    z-index: 10; 
    -webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
} 
.ac-container input:checked ~ article { 
    -webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    -ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    transition: height 0.3s ease-in-out, box-shadow 0.6s linear; 
    box-shadow: 0px 0px 0px 1px rgba(155,155,155,0.3); 
    height: 100px; 
} 

.ac-container article p{ 
    font-style: italic; 
    color: #777; 
    line-height: 23px; 
    font-size: 14px; 
    padding: 20px; 
} 

Answer 1

<input id="ac-1" name="accordion-1" type="checkbox" />

に変更<input id="ac-1" name="accordion-1" type="checkbox" checked />

をcheckedを削除します。アコーディオンは、チェックされているこれらのチェックボックスに依存しているようです。 checkedを削除しても開けません。