rarebit Posted December 15, 2008 Share Posted December 15, 2008 Hi, I'm doing a little drop down menu, but for some reason I can't get rid of the gaps between the dropdowns' rows. I'd say ot was the borders, but it seems not, tried padding and margins too, but still no joy... <html> <head> <style type="text/css"> body { color:#313141; font-family: arial,helvetica,geneva,sans-serif; font-size: 14px; } #smenu a, #smenu a:visited { text-decoration:none; color:#313141; } #smenu table, #smenu tr, #smenu td { margin: 0; border: 0px none; padding: 0px; } #smenu span { margin: 1px -45px; display:none; position: absolute; border: 0px none; padding: 0px; } #smenu td:hover span { display:block; border: 0px none; padding: 0px; } #smenu table.submenu, #smenu td.submenu, #smenu tr.submenu, #smenu tbody.submenu { padding: 0px; margin: 0px; border: 0px none; } .a_smenu:link, .a_smenu:visited, .a_smenu:active { display: block; color:#ffffff; font-size: 15px; font-weight: bold; text-decoration: none; background: #efefef; padding: 3px; margin: 0px; } .a_smenu:hover { display: block; color:#000000; font-size: 15px; font-weight: bold; text-decoration: none; cursor: pointer; background: #aabbcc; padding: 3px; margin: 0px; } </style> </head> <body> <div> <table cellspacing='0' id="smenu" > <tr style='height:25px; background-image: url(smenu_bg.png);'> <td width='50px'><br></td><td width='50px'><a>User</a> <span><table class='submenu' width='100'> <tr class='submenu'><td class='submenu'><a class='a_smenu' href='#'>Login</a></td></tr> <tr class='submenu'><td class='submenu'><a class='a_smenu' href='#'>Register</a></td></tr> <tr class='submenu'><td class='submenu'><a class='a_smenu' href='#'>Resend</a></td></tr> <tr class='submenu'><td class='submenu'><a class='a_smenu' href='#'>Profile</a></td></tr> <tr class='submenu'><td class='submenu'><a class='a_smenu' href='#'>Logout</a></td></tr> <tr class='submenu' style='height:10px; background-image: url(smenu_bg_base.png);'><td class='submenu'></td></tr> </table></span></td> </tr> </table> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
CroNiX Posted December 16, 2008 Share Posted December 16, 2008 Hi, I'm doing a little drop down menu, but for some reason I can't get rid of the gaps between the dropdowns' rows. I'd say ot was the borders, but it seems not, tried padding and margins too, but still no joy... Not sure why you are using tables for this, but try adding cellspacing=0, cellpadding=0, and border=0 to <table class='submenu' width='100'> Quote Link to comment Share on other sites More sharing options...
rarebit Posted December 16, 2008 Author Share Posted December 16, 2008 I thought I had, but I added: cellspacing='0px' cellpadding='0px' border='0px' to both inner and outer table, all to no effect. Quote Link to comment Share on other sites More sharing options...
rarebit Posted December 16, 2008 Author Share Posted December 16, 2008 Hi, I've taken your advice and removed the inner table and replaced with divs... Cheers. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.