having trouble with the drop down nav.

[profoundtigger 0]

My page is www.profoundtigger.com I recently customize the primary nav to my desire. But when i use the drop down feature on the nav, it causes the navigation to expand creating a huge block.

[Jenny 33]

You have some real funky stuff going on with your CSS. Can you please paste your entire custom CSS here? Please include it inside [ code ] [ /code ] tags (remove the extra spaces) for ease of viewing. Thanks!

[profoundtigger 0]

[code] #cred {display:none} #footer{ margin: 0 auto; height: 235px; } #dp-twitter-widget-4 h3.widget-title { background:url('http://profoundtigger.com/wp-content/uploads/2011/09/footer-twitter23.png') no-repeat top left;padding:10px 29px;font-size:87.5%;line-height:11px;} #artfacebookrecent-5 h3.widget-title { background:url('http://profoundtigger.com/wp-content/uploads/2011/09/footer-facebook23.png') no-repeat top left;padding:10px 29px;font-size:87.5%;line-height:11px;} .widget-title { font-size: 1em; margin-bottom: 0.6em; padding: 6px 8px 3px 0; text-align: left; } .main-nav li a { font-size: 1em; } .metabar em { font-size: 13px; font-style: normal; line-height: 1.75em; } .fpost .post-excerpt, .fpost .entry_content { font-size: 15px; line-height: 23px; } .fpost .post-excerpt { margin: 0; } .form-allowed-tags {display:none;} img.attachment-thumbnail {width: 263px;} img.attachment-thumbnail {height: 175px;} #feature_slider .fcontent .dcol-pad { height: 230px; padding: 6px 20px; font-size: 80%; } .one-sidebar-right #column-main .mcolumn-pad, .one-sidebar-right #container #content, .two-sidebar-right #column-main .mcolumn-pad, .two-sidebar-right #container #content { padding: 2em 30px 0 0; } .scolumn-pad { padding: 2em 0 0.7em 18px; } #feature_slider .fmedia .dcol-pad { text-align: center; padding: 0px; } #primary-nav ul a { color: #FFFFFF; font-weight: bold; font-size: 15px; background: #161616; } .dcol_container_5 { float: left; width: 1000px; } .style2.tabberlive .tabbertab { border: 1px solid #CCCCCC; margin-top: 0px; padding: 25px; font: bold 12px helvetica,sans-serif; font-color: #000000; width:249px; } .style2 ul.tabbernav li a:link { color: #000000; } .style2 ul.tabbernav li a { -moz-border-bottom-colors: none; -moz-border-image: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background: none repeat scroll 0 0 #E9E9E9; border-color: #CCCCCC #CCCCCC -moz-use-text-color; border-style: solid solid none; border-width: 1px 1px medium; margin-left: 3px; padding: 3px 0.5em; text-decoration: none; } .style2 ul.tabbernav { border-bottom: none; font: bold 12px helvetica,sans-serif; padding: 2px 12px } .style2 ul.tabbernav li a:hover { background: none repeat scroll 0 0 #E9E9E9; border-color: #000000; text-decoration: none; } #carousel .thecarousel { background: #ffffff; } #carousel .jcarousel-prev { background: url("http://profoundtigger.com/wp-content/uploads/2011/10/carousel-left.png") no-repeat scroll 0 0 transparent; cursor: pointer; left: 15px; } #carousel .jcarousel-next { background: url("http://profoundtigger.com/wp-content/uploads/2011/10/carousel-right.png ") no-repeat scroll 0 0 transparent; cursor: pointer; right: 15px; } #carousel .jcarousel-next, #carousel .jcarousel-prev { top: 45%; } .widget ul li { padding: 0.30em 3px; } #primary-nav ul { background: none repeat scroll 0 0 #161616; float: left; margin: 0 45px 0 0 !important; padding: 5px 0; position: relative; } #globalnav ul{ background: none repeat scroll 0 0 #FFFFFF; float: left; margin: 0 45px 0 0 !important; padding: 5px 0; position: relative; } #globalnav ul a { color: #000000; font-weight: bold; font-size: 12px; background: #FFFFFF; } #globalnav ul.main-nav a:hover { color: #0F457C; } #primary-nav ul.main-nav a:hover { color: #777777; } .searchform .searchfield { height: 13px; padding: 7px 30px 5px 7px; width: 170px; border-radius: 6px 6px 6px 6px; } #boxes h3 { font: 1.3em georgia,sans-serif; padding: 0 0 2px; } #footer .widget-title { border: 0 none; font: 0.85em arial black,sans-serif; margin-bottom: 0.6em; padding-left: 0; } .fpost .post-title h2 { font-size: 22px; font-weight: bold; letter-spacing: -0.5px; text-shadow: 0 1px 0 white; line-height: 1em; margin: 0; padding-bottom: 0; text-transform: none; } #nav_row.main_nav, ul.sf-menu ul li { border-bottom: none; } #primary-nav { padding-bottom: 1px; } [/code]

[Danny+ 1,327]

Well first thing to do is deactivate W3 Total Cache, this plugin should only used when your site is finished, meaning no more CSS needs to be added and also you should really be careful when using the minify setting on .js files, not every file can be added. Not sure if you have noticed but you actually have a javascript error on your site: [code] Error: jCarousel: No width/height set for items. This will cause an infinite loop. Aborting... Source File: http://profoundtigger.com/wp-content/w3tc/min/875e4856.291b44.js Line: 75 [/code] So please deactivate the W3 Total cache and see if the drop down error disappears, if it doesn't then we can take a closer look.

[profoundtigger 0]

okay i've disabled W3 Total cache. The drop down error still appears may you take a closer look? also where is this javascript coming from? so i can take a closer look in it.

[Danny+ 1,327]

Hi, OK I think the issue with your drop down is with your CSS code here: [code] #primary-nav ul { background: none repeat scroll 0 0 #161616; float: left; margin: 0 45px 0 0 !important; padding: 5px 0; position: relative; <--Removing this, should do the trick! } [/code] When I removed the "Position: Relative;" using Firebug the drop down no longer acted crazy, so remove that line from your CSS and hopefully that should resolve it. As for your javascript error, with W3 Total Cache disabled the error is saying this now: [code] Error: jCarousel: No width/height set for items. This will cause an infinite loop. Aborting... Source File: http://profoundtigger.com/wp-content/themes/platformpro/sections/carousel/carousel.jcarousel.js?ver=1.0 Line: 16 [/code]

[profoundtigger 0]

Thanks, i fixed the drop nav is working like a champ. So assuming from the error code in carousel what am i doing wrong? I only change the background color of the carousel and edited the cursor.

[Danny+ 1,327]

To be totally honest I'm not quite sure why it's doing that error. Maybe, W3 Total Cache screwed it up somehow, if I was you I would create a new one and see if the error persists.

[profoundtigger 0]

okay, ill try to figure it thanks. Can you tell me what program you use that identify the program? or if you used firebug can you tell me how you were able to encounter that error with firebug? Once again thanks for your help.

[Danny+ 1,327]

Iits an extention for Firefox called Web Developer. https://addons.mozilla.org/en-US/firefox/addon/web-developer/

[Jenny 33]

Keep in mind that even though you've disabled the caching plugin, that's not enough. The cached files still exist. You must go into your site via FTP and delete the files in the caching folders within the plugin directory.