PDA

View Full Version : Drop Down Tabs (menu align problem)



JosBvg
06-22-2009, 10:30 AM
1) Script Title: Drop Down Tabs

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/droptabmenu.htm

3) Describe problem: When i put the menu into my page which uses a center align body tag the drop down menu dont align correctly. If i align the page to the left the drop downs are in the correct place but i dont want that. I have tried for hours using left aligned tables, body tags and wrappers but nothing seems to work. Can anyone help, it would be much appreciated.

http://www.totalfishinggear.co.uk/index_tfg_test.cfm

JosBvg
06-25-2009, 09:17 AM
Can anyone help me with this.
If i remove the the header nav from the wrapper div it works fine, but because of the way our sites are set up this is just not feasable. I have tried putting it in its own wrapper and editing the body tag but neither have worked.
Any info would be much appreciated as the navigatiojn look great, just dosent seem to work in a dynamic site structure.

ddadmin
06-25-2009, 06:12 PM
Most of the positioning problems with the drop down menus can be solved by making sure the HTML for the drop down DIVs themselves is outside any container tag on the page other than the BODY. So in your case, try moving all the drop down DIVs to the very bottom of your page, just above the "</body>" tag:


<!--1st drop down menu -->
<div id="dropmenu1_a" class="dropmenudiv_a">
<a href="http://www.totalfishinggear.co.uk/TFG_J08_ComingSoon.cfm">Coming Soon</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Rods.cfm">Rods</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Reels.cfm">Reels</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Lines.cfm">Lines</a>

<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Accessories.cfm">Accessories</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Baits.cfm">Baits</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_BaitBoats.cfm">Bait Boats</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_BedsAndChairs.cfm">Beds & Chairs</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_BiteAlarms.cfm">Bite Alarms</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Bivvies.cfm">Bivvies</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Clothing.cfm">Clothing</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_FishCare.cfm">Fishcare</a>

<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Glasses.cfm">Glasses</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Luggage.cfm">Luggage</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_Nets.cfm">Nets</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Products_SleepingBags.cfm">Sleeping Bags</a>
</div>


<!--2nd drop down menu -->
<div id="dropmenu2_a" class="dropmenudiv_a" style="width: 150px;">
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Instruction1.cfm">Fishing For Tench</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Instruction2.cfm">Grayling Fishing</a>

<a href="http://www.totalfishinggear.co.uk/TFG_J08_Instruction3.cfm">Carp Fishing</a>
</div>


<!--3rd drop down menu -->
<div id="dropmenu3_a" class="dropmenudiv_a" style="width: 150px;">
<a href="http://www.totalfishinggear.co.uk/TFG_J08_NewFor2009.cfm">New For 2009</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_ComingSoon.cfm">Coming Soon</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_HotNewProducts.cfm">Hot New Products</a>
</div>


<!--4th drop down menu -->

<div id="dropmenu4_a" class="dropmenudiv_a" style="width: 150px;">
<a href="http://www.totalfishinggear.co.uk/TFG_J08_ContactUs.cfm">Contact Us</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_Stockists.cfm">Stockist</a>
<a href="http://www.totalfishinggear.co.uk/TFG_J08_FreeCat_Submit.cfm">Request a Catalogue</a>
</div>

<script type="text/javascript">
//SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"])
tabdropdown.init("colortab", 3)
</script>

</body>