{"action":"created","issue":{"url":"https://api.github.com/repos/zurb/foundation-sites/issues/7067","labels_url":"https://api.github.com/repos/zurb/foundation-sites/issues/7067/labels{/name}","comments_url":"https://api.github.com/repos/zurb/foundation-sites/issues/7067/comments","events_url":"https://api.github.com/repos/zurb/foundation-sites/issues/7067/events","html_url":"https://github.com/zurb/foundation-sites/issues/7067","id":118085081,"number":7067,"title":"[F6] [Dropdown Menu] Dropdown opens off-screen with right-aligned menu (not RTL text)","user":{"login":"CodeGordon","id":7526525,"avatar_url":"https://avatars.githubusercontent.com/u/7526525?v=3","gravatar_id":"","url":"https://api.github.com/users/CodeGordon","html_url":"https://github.com/CodeGordon","followers_url":"https://api.github.com/users/CodeGordon/followers","following_url":"https://api.github.com/users/CodeGordon/following{/other_user}","gists_url":"https://api.github.com/users/CodeGordon/gists{/gist_id}","starred_url":"https://api.github.com/users/CodeGordon/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/CodeGordon/subscriptions","organizations_url":"https://api.github.com/users/CodeGordon/orgs","repos_url":"https://api.github.com/users/CodeGordon/repos","events_url":"https://api.github.com/users/CodeGordon/events{/privacy}","received_events_url":"https://api.github.com/users/CodeGordon/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":{"login":"gakimball","id":1142001,"avatar_url":"https://avatars.githubusercontent.com/u/1142001?v=3","gravatar_id":"","url":"https://api.github.com/users/gakimball","html_url":"https://github.com/gakimball","followers_url":"https://api.github.com/users/gakimball/followers","following_url":"https://api.github.com/users/gakimball/following{/other_user}","gists_url":"https://api.github.com/users/gakimball/gists{/gist_id}","starred_url":"https://api.github.com/users/gakimball/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gakimball/subscriptions","organizations_url":"https://api.github.com/users/gakimball/orgs","repos_url":"https://api.github.com/users/gakimball/repos","events_url":"https://api.github.com/users/gakimball/events{/privacy}","received_events_url":"https://api.github.com/users/gakimball/received_events","type":"User","site_admin":false},"milestone":null,"comments":11,"created_at":"2015-11-20T17:14:16Z","updated_at":"2015-11-25T21:56:01Z","closed_at":"2015-11-25T05:19:16Z","body":"When using right-aligned menus, but not RTL text orientation (not using the .align-right class), dropdown menus still open aligned to their parent's left side. Such dropdowns should align instead to their parent's right side to appear on-screen as expected. This worked just fine in Foundation 5 without additional markup on any involved elements.\r\n\r\nThe following code will reproduce the issue with Foundation v6.0.1\r\n```html\r\n<nav class=\"title-bar\" role=\"navigation\">\r\n    <section class=\"title-bar-left\">\r\n        <span class=\"title-bar-title\"><a href=\"/\">Example Right Dropdown</a></span>\r\n    </section>\r\n    <section class=\"title-bar-right\">\r\n        <ul class=\"dropdown menu align-right\" data-dropdown-menu role=\"menubar\">\r\n            <li class=\"has-submenu\">\r\n                <a href=\"javascript:void(0);\">Menu</a>\r\n                <ul class=\"submenu menu\" data-submenu role=\"menu\">\r\n                    <li><a href=\"/menu-item\">Menu Item</a></li>\r\n                </ul>\r\n            </li>\r\n        </ul>\r\n    </section>\r\n</nav>\r\n```\r\n\r\nIncluded CSS: Foundation v6.0.1, Normalize v3.0.3\r\nIncluded JS: Foundation v6.0.1, jQuery v2.1.4"},"comment":{"url":"https://api.github.com/repos/zurb/foundation-sites/issues/comments/159740398","html_url":"https://github.com/zurb/foundation-sites/issues/7067#issuecomment-159740398","issue_url":"https://api.github.com/repos/zurb/foundation-sites/issues/7067","id":159740398,"user":{"login":"zurbchris","id":13631168,"avatar_url":"https://avatars.githubusercontent.com/u/13631168?v=3","gravatar_id":"","url":"https://api.github.com/users/zurbchris","html_url":"https://github.com/zurbchris","followers_url":"https://api.github.com/users/zurbchris/followers","following_url":"https://api.github.com/users/zurbchris/following{/other_user}","gists_url":"https://api.github.com/users/zurbchris/gists{/gist_id}","starred_url":"https://api.github.com/users/zurbchris/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zurbchris/subscriptions","organizations_url":"https://api.github.com/users/zurbchris/orgs","repos_url":"https://api.github.com/users/zurbchris/repos","events_url":"https://api.github.com/users/zurbchris/events{/privacy}","received_events_url":"https://api.github.com/users/zurbchris/received_events","type":"User","site_admin":false},"created_at":"2015-11-25T21:56:01Z","updated_at":"2015-11-25T21:56:01Z","body":"I'm going to leave this one for @gakimball to resolve this in the scss, but here's a working solution for now:\r\napply the `align-right` class to your dropdown menu, then in your own sass/css target `.menu.align-right > li` with `float: left;`.\r\nThis is not an ideal solution, but that's what I have for you for now. This is the result: \r\n\r\n<img width=\"245\" alt=\"screen shot 2015-11-25 at 1 54 23 pm\" src=\"https://cloud.githubusercontent.com/assets/13631168/11410430/27c86c84-937c-11e5-84ea-fc23c7289350.png\">\r\n\r\nCheers."}}