AngualrJS (Maybe Bootstrap) - "hamburger" doesn't expand the content

1. I bought this template
and I'm customizing it.

2. On the link above, click on the "hamburger" on top. You see how the side menu shrinks and the main content expands
3. In my site, the side menu shrinks but the main content doesn't expand

You can see it here:


Login with / Password321$

doesn't work
4. I checked the Chrome Developer's tool and I see the CSS tag being added

5. I also put debug step in the demo site (I have the code locally from Themefoest).. There's a function setSmallNavigation() but  I commented it out and the demo still worked.

I'm not sure what I'm missing.
Who is Participating?
Julian HansenCommented:
You are missing this style in your application

.appWrap.navigation-sm #content {
    padding-left: 60px;

Open in new window

You need to add that to change the padding on the main content when the menu is collapsed.
CamilliaAuthor Commented:
ah. How did you debug to find what's missing?
Julian HansenCommented:
Looked at the original template link and compared what was happening in the console to your code.

On the original link when you click the hamburger menu the padding on the main container changes - from there it was a case of simply highlighting the container and viewing the styles window to see what changed when the hamburger was clicked.

This showed the above style coming into play when the hamburger was clicked.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.