For all the ScriptKittens out there, I would like to ask for some help regarding in the dropdown menu using html and css. Well you see here in the picture, My page has this bar below the picture that contains buttons and two of them have dropdown menu on them, I used ul and li with a bunch of css coding to make them but I have some issues on using them, (I'll show you do code later on)
Well you see, I was planning to have a table below the selection bar to put up informations and all that, but whenever the mouse hovers in and the dropdown menu shows up, it affects the table below. its like the dropdown menu is a part of the bar and it somehow "push aside" the table below. And secondly, I cannot center the selection bar, so i just adjusted it with putting a few margin to the centered Image.
Well, here's the whole code of the HTML:
html lang="en">
head>
title>Sample HTML by Hako
style>
body {
background-image: url('background.png');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}
/style>
/head>
body>
center>
img src="pict1.jpg" width= "927px" margin-bottom="0px">
ul>
style type="text/css">
ul{
margin-top: 0px;
margin-left: 20px;
padding: 0px;
list-style: none;
}
ul li{
float: left;
width: 232px;
text-align: center;
line-height: 21px;
}
ul li a{
font-size: 15px;
font-family: Calibri;
display: block;
padding: 10px 10px;
color: #333;
background: skyblue;
text-decoration: none;
}
ul li a:hover{
color: #fff;
background: aqua;
}
ul li ul{
display: none;
}
ul li:hover ul{
display: block; /* display the dropdown */
}
/style>
/head>
body>
center>
div>
ul>
li>
Home li>
About/li>
li>
a href="#">AnimeList ▾
ul>
li>
Ongoing li>
Completed li>
All /ul>
/li>
li>
Others ▾ul>
li>
Forums li>
Chatrooms li>
AniWiki /ul>
/li>
/ul>
/div>
div>
TABLE BORDER="0" cellpadding="0" CELLSPACING="0">
TABLE margin-top "12px">
TR>
TD WIDTH="221" HEIGHT="300" BACKGROUND= "T1.png" Valign= "top">
FONT SIZE="+1" COLOR="yellow">Joe Burns at Work
/TR>
/TABLE>
/div>
/body>
/html>
(I just found out that this page recognize html coding even in the reps!!!)
Well Advance thanks for the reps.
And also It's amateur work, so dont bash me
Sayonnara!!