javascript - CSS inherit not responding to change in parent element -


i splitting page .left-side , .right-side .right-side has nav fixed top. difficult nav full width of it's parent .right-side had use width: inherit, left: inherit.

so far , looks great!

now parent has ability class active increase it's width 100%. child nav width inherit not respond change.

take look:

.right-side{   padding-top: 190px;   width: 83.33333333%;   float: right;   display: block;   position: relative;   background-color: #fff;   transition: width 0.5s; } .right-side.active{   width: 100%; } nav.navbar {   background-color: #f1ecd8;   width: inherit;   right: 0px;   left: inherit; } 

the right-side responds when adding class active nav doesn't more or change accordingly it. how can fix this?

i should mention, works fine when manually in chrome dev tools.

try this:

.right-side{   padding-top: 190px;   width: 83.33333333%;   float: right;   display: block;   position: relative;   background-color: #fff;   transition: width 0.5s; } .right-side.active{   width: 100%; } nav.navbar {   background-color: #f1ecd8;   position: absolute;   top: 0px;   right: 0px;   left: 0px; } 

Comments

Popular posts from this blog

javascript - Bootstrap Popover: iOS Safari strange behaviour -

Magento/PHP - Get phones on all members in a customer group -

session - Logging Out Using PHP -