View Full Version : Problem With Chrome CSS Drop Down Menu

08-18-2008, 10:13 PM
1) Script Title: Chrome CSS Drop Down Menu (v2.4)

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

3) Describe problem:

On the site http://www.shawshara.com, if the window width is large (try 1600px or more) the drop down menu does not appear right under its parent menu. Please note that the user doesn't see any problem is the 1280px or smaller. The wider the window the more apparent the problem is.

Can you suggest any fixes for this problem? Thanks in advance.

08-19-2008, 07:32 PM
What browser are you speaking of?
I tried it in FF3, and IE 7. It works in both.
Also, if you mean it displaying on top of the menu, instead of button, thats by default.
I hope this helps, Nile

08-19-2008, 10:22 PM
Thanks for responding to my post.

The problem occurs with both IE7 and FF3. The problem occurs only if your browser is wider than 1600px. The wider the browser window the more apparent the problem. Once you hover over the main navigation nodes, the drop down menu doesn't appear right under the main navigation nodes but more to the right.

08-20-2008, 10:29 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 bottom of your page, just above the "</body>" tag:

<div id="navigation_.2F_.D8.AA.D8.B5.D9.81.D8.AD" class="dropmenudiv">
<a href="/wiki/Main_Page">Home / الصفحة الرئسية</a><a href="/wiki/Special:Recentchanges">Recent changes / أحدث التغييرات</a><a href="/wiki/Shawshara:Tutorial">Tutorial / كيفية تعديل الصفحات</a><a href="/wiki/Shawshara:Requests">Request a song / أطلب أغنية</a></div>

<div id="Artists_List_.2F_.D9.82.D8.A7.D8.A6.D9.85.D8.A9_.D8.A7.D9.84.D9.85.D8.BA.D9.86.D9.8A.D9.86" class="dropmenudiv">
<a href="/wiki/Category:%D9%85%D8%BA%D9%86%D9%8A%D9%86">بالأحرف العربية</a><a href="/wiki/Category:Singers">English alphabet</a></div>

<div id="Songs_List_.2F_.D9.82.D8.A7.D8.A6.D9.85.D8.A9_.D8.A7.D9.84.D8.A3.D8.BA.D8.A7.D9.86.D9.8A" class="dropmenudiv">
<a href="/wiki/Category:%D8%A3%D8%BA%D8%A7%D9%86%D9%8A">بالأحرف العربية</a><a href="/wiki/Category:Songs">English alphabet</a></div>

<div id="Community_.2F_.D8.B4.D8.A7.D8.B1.D9.83.D9.88.D9.86.D8.A7" class="dropmenudiv">
<a href="http://blog.shawshara.com">Blog / مدوّنة</a><a href="http://www.facebook.com/pages/Shawsharacom/19204712964">Facebook Page / صفحتنا على فيس *بوك</a><a href="http://www.facebook.com/apps/application.php?id=27553764032">Facebook App / تطيق فيس *بوك</a></div>

<div id="toolbox" class="dropmenudiv">
<a href="/wiki/Special:Whatlinkshere/Main_Page" title="List of all wiki pages that link here [j]" accesskey="j">What links here</a><a href="/wiki/Special:Recentchangeslinked/Main_Page" title="Recent changes in pages linked from this page [k]" accesskey="k">Related changes</a><a href="/wiki/Special:Upload" title="Upload files [u]" accesskey="u">Upload file</a><a href="/wiki/Special:Specialpages" title="List of all special pages [q]" accesskey="q">Special pages</a><a href="/w/index.php?title=Main_Page&amp;oldid=3004" title="Permanent link to this version of the page">Permanent link</a></div>
<script type="text/javascript">


BTW, please note that your page is currently in violation of our usage terms, since the credit notice doesn't appear inline on the page. Please reinstate the credit notice: http://www.dynamicdrive.com/notice.htm

08-20-2008, 11:20 PM
Thanks for your help. Your suggestion fixed the problem, and I also added the copyright notice. Thanks again for your support.