수다닷컴

삼성갤럭시노트 사이트와 똑같이 만드는데 어떤건 이미지 롤오버가 제대로 되고 탑메뉴 롤오버는 되지가 않아요.
http://www.howtolivesmart.com/galaxynote10.1/main.html

div id=wrap
div id=header
div id=logo
a href=main.html
img src=images/logo.gif alt=Samsung GALAXY Note /
/a
/div
div id=navi
ul
li
a href=#
img src=images/menu_03.gif /
img src=images/ro_menu_03.gif class=over/이부분이 안돼요.
/a
/li
li

/li
li

/li
li

/li
li class=academy
a href=#
img src=images/r_logo.gif alt=삼성갤럭시 노트 아카데미 페스티벌 /
/a
/li
/ul
/div
/div
div id=top_shade
/div
div id=main_image
div id=main-image1/div
div id=copy_imgae
img src=images/maingalaxy_16.gif alt=스케일이 다른 갤럭시 노트의 등장 Galaxy Note 10.1 /
/div
/div
div id=contents
div id=main_feature_navi
ul
li
div class=ftitle
a href=#
img src=images/title_20.gif /
img src=images/ro_title_20.gif class=over / 여기는 제대로 됩니다.
/a
/div

css

#contents {
min-height:431px;
position:relative;
}
#main_feature_navi {
height:212px;
position:relative;
}
#main_feature_navi ul li {
border-right-color:#C8C8C8;
border-right-style:solid;
border-right-width:1px;
display:block;
float:left;
height:160px;
margin:29px 0 0 30px;
width:162px;
}
#main_feature_navi ul li a img.over {여기가 탑 롤오버인데 안됩니다..
display:none;
}
#main_feature_navi ul li a:hover {
position:relative;
}
#main_feature_navi ul li a:hover img {
display:none;
}
#main_feature_navi ul li a:hover img.over {
display:inline;
}
#main_feature_navi ul li a img {
vertical-align:top;
}
#main_feature_navi ul li .ftitle {
height:64px !important;
margin:0 0 20px;
}
#main_feature_navi ul li .ftitle a img.over {여기는 제대로 되는 css
display:none;
}
#main_feamain_feature_navi ul li .ftitle a:hover {
position:relative;
}
#main_feature_navi ul li .ftitle a:hover img{
display:none;
}
#main_feature_navi ul li .ftitle a:hover img.over{
display:inline;
}
#main_feature_navi ul li .ftitle a img {
vertical-aligh:top;
}저 롤오버 css보다 더 간단하게 줄이는 방법도 있나요?

신청하기