Drop Down Menu / Posts /

pull down menu is oversized when viewed with ipad


when the a pull down menu with 3 columns for full width is viewed on an ipad, the menu item "overhangs" to the side of the page... even the sample that you have here does the same thing.  For example at if you view http://www.menucool.com/drop-down-menu with an Ipad, the Accusantium top level menu item's pull down does not show up right on an IPAD.  How can this be fixed?

charlie  8 years ago   viewed: 2999    

3 Answers


The Accusantium item is given the class "offset300". You can instead use the "full-width" class, or change the CSS setting for "offset300", say "left:-400px".

Milo   8 years ago

I have a similar issue (using the "full-width" class).

Viewing on an ipad or similar the drop down content is too wide for the viewport.

I have a menu that has 13 drop downs and some of these drop downs have 5 columns of sub menu items.

I suppose the only way to sort that would be to put these into div's that wrap when the screen is smaller?

Or is there a way that the menu system natively does it?

  8 years ago

You can use the media query in the CSS to specify the styles for iPad. For example:

@media only screen and (max-width: 10240px) {

        #ddmenu .offset300 {left:-500px;right:auto;}


Milo   8 years ago


Your name*
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: