Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Framework Basics Prototyping with Bootstrap Building Modal Windows and Forms

Posted by Michael Edwards
Michael Edwards
4,955 Points

When I bring up the final version in Chrome, the whole page layout shifts to the left. It shifts back right afterwards.

Any ideas why the introduction of the modal would be shifting the whole page layout? This happens even in an unaltered "final" version of the project.

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

Could you show us your code? maybe we can spot something. Or whatever is happening, if its the code.

4 Answers

Michael Edwards
Michael Edwards
4,955 Points
Michael Edwards
Michael Edwards
4,955 Points

Aurelian Spodarec, it happens when I use an unaltered copy of the "Final" html provided in the project files for that lesson.

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

Um , i don't know but does it happen only in Chrome?

Michael Edwards
Michael Edwards
4,955 Points

It also happens in Firefox. I made a screencast of the issue happening: https://www.youtube.com/watch?v=qfK9CFcIBt8&feature=youtu.be

My hunch is that it might be Mac OS X, which likes to hide scroll bars by default. I'm wondering if the modal window is activating the scroll bar, thus taking up window space and shifting the viewport size.

I'll do some testing and report back.

spencermccullough
spencermccullough
7,897 Points
spencermccullough
spencermccullough
7,897 Points

I'm having the same issue. If anyone knows why that is I would love to know.

Quicken Loans
Quicken Loans
12,654 Points
Quicken Loans
Quicken Loans
12,654 Points

I am having this same issue - It even happens on the code from the project files

Guil Hernandez

I added 

.modal {
overflow: auto;
}

That keeps the body steady, but the fixed nav bar still shifts

Laurel O'Brien
Laurel O'Brien
1,223 Points
Laurel O'Brien
Laurel O'Brien
1,223 Points

I don't know why, but it does this on my mac and not my boyfriend's PC, regardless of browser. My carousel also changes height for a second between slides.