Problems trying to create a Css only drop-down menu.

[marktheman]

I’m trying to create a css only drop-down menu like the ones in html. Here is my code for trying to do so.
/* setting dealing with selecting particular guest book entries */

#menuSelectGuestEntries

{

position: relative;

margin-top: 10px;

padding-left: 466px;

}



#menuSelectGuestEntries form

{

color: #000;

font-family: Arial, Helvetica, sans-serif;

font-size: 2.12em;

}



#menuSelectGuestEntries .guestBookPages{

visibility:hidden;

}



#menuSelectGuestEntries .guestBookPages:hover{

visibility:visible;

}



#selectGuestBookEntries {

border: solid 1px grey;

background-color: white;

padding-right; 5px;

width: 70px;

font-size: 13px;

height: 16px;

overflow: auto;

}



#menuSelectGuestEntries ul.guestBookPages {

position: absolute;

color: black;

background-color: white;

font-size: 20px;

top: 1px;

left: 517px;

list-style-type: none;

padding-left:0;

padding-right: 0;

margin-left: 0;

width: 66px;

border: solid 1px grey;

border-top: none;

}



ul.guestBookPages a {

display: block;

text-decoration: none;

width: 70px;

zoom: 1;

}



ul.guestBookPages a:hover {

background-color: #104E8B;

font-weight: bold;

width: 66px;

}

html code





Page: <



1 of 212 

>



1 of 212


2 of 212


3 of 212


4 of 212


5 of 212

What I’ve tried to do is make the form with id

#menuSelectGuestEntries

relative positioned is it looks like the first option of a drop-down menu. Then what I was hoping for was to have the drop-down list named

#menuSelectGuestEntries

absolutely positioned so when someone hovered over the span with id

selectGuestBookEntries

which contains the first entry all the entries in list

guestBookPages

would become visible. I’m trying to avoid the Javascript methods of doing this if possible, not a big fan. Any ideas of code I could use in the above scenario to make the listing in the id

guestBookPages

visible using the hover tag somewhere? Any help greatly appreciated. The visibility is not working at present, not even too sure if the way I’m trying to call the visibility is correct.

[Author]

Posts