Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML

Brandon Brigham
Brandon Brigham
3,716 Points

How to make modal overlay everything on page when it pops up

Hello,

So if you visit the site I'm working on here: http://everythingpropertymanagement.com

and you enter in the top search bar some word or phrase, let's say "property management" then there are search results that pop up. But then you will notice the top left logo is interfering with the popup and also causing the close "X" not to function.

Also if you scroll down with the modal still open elements on the page are overlapping the modal.

Any ideas on how to fix this?

I've messed with the z-indexes but nothing is seeming to change it.

BTW this is a WordPress plugin - Google Custom Search

Thanks for any help!

Just so you know I get a 509 error, saying that your bandwidth limit has been exceeded.

1 Answer

Steven Ventimiglia
Steven Ventimiglia
27,364 Points

We can't seem to access the page, however...

  1. Use F12 to inspect elements if you aren't already. It's more informative than a simple "View Source".
  2. Make sure that the z-index of the modal is higher than the other elements, including the images.
  3. Give the modal a fixed position (not absolute), as well. This should always be checked on touch devices.

If it's a hosted solution, then pasting code may not be as effective as wrapping it in something that you can control better. Try to get something up so we can access it.