Material: md-sidenav-right locked open ?

Created on 27 May 2015 · 5Comments · Source: angular/material

I'm trying to have a sidenav-right that stays opened. I took the example found here: https://material.angularjs.org/latest/#/demo/material.components.sidenav

The problem is that if I add the attribute md-is-locked-open="$mdMedia('gt-md')" to my md-sidenav-right element, it is then left-aligned. Looking at the CSS, I don't see why, as it has left: 100%.

Is it possible to have a right navbar that is locked open ?

Source

warpdesign

Most helpful comment

@warpdesign Were you able to figure this one out? I'm having the same issue

jonathanwoahn on 15 Feb 2016

👍2

All 5 comments

Seems to work fine on chrome. Example: http://codepen.io/mckenzielong/pen/yNVGWm

mckenzielong on 27 May 2015

😕1

Seems like there was something wrong with my CSS.

warpdesign on 1 Jun 2015

👍1

@warpdesign Were you able to figure this one out? I'm having the same issue

jonathanwoahn on 15 Feb 2016

👍2

I had the issue. For me, the fix was simply moving the below my main content if I wanted it to lock on the right

kanesee on 25 May 2017

@ThomasBurleson @warpdesign @jonathanwoahn The locked-open md-sidenavs have position:static;, not absolute, so their position within the containing element matters (being first/last child that is visible). An md-sidenav-left should be the first-child and and md-sidenav-right the last-child to make the layout work.
Example: https://codepen.io/anon/pen/MvQOZP