# Ideas for a revamped Explore/Observations Search Page

**URL:** <https://forum.inaturalist.org/t/ideas-for-a-revamped-explore-observations-search-page/8439>\
**Category:** General\
**Tags:** web, brainstorm\
**Created:** [December 4, 2019, 10:24pm UTC](https://forum.inaturalist.org/t/ideas-for-a-revamped-explore-observations-search-page/8439 "2019-12-04T22:24:55Z")\
**Posts on this page:** 1\
**Showing post:** 388

<div class="post-metadata">

**Author:** ![raduluchian](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.inaturalist.org/raduluchian/32/67194_2.png) [@raduluchian](https://forum.inaturalist.org/u/raduluchian)\
**Post date:** [January 19, 2026, 8:33pm UTC](https://forum.inaturalist.org/t/ideas-for-a-revamped-explore-observations-search-page/8439/388 "2026-01-19T20:33:27Z")

</div>

As many have already mentioned, using the map view on small screens (e.g. built-in laptop screen) works fine (see first screenshot below), however on larger screens the map itself doesn’t scale vertically and the controls and, more importantly, the list of observations are both centered on the map, instead of being aligned to the lateral edges of the window (see second screenshot below). This is a _very_ poor use of screen space, especially for those working with external displays and higher resolutions.

 ![inat-map-small-screen](https://us1.discourse-cdn.com/flex016/uploads/inaturalist/original/3X/9/d/9ddc47773025f55de89644cba545b3b8291a2e4d.jpeg)

 ![inat-map-large-screen-issue](https://us1.discourse-cdn.com/flex016/uploads/inaturalist/original/3X/1/f/1febfdb650b75fd0a1e97901a12f23519c8c566e.jpeg)

I’ve seen similar posts from [2019](https://forum.inaturalist.org/t/put-the-species-list-in-a-sidebar-rather-than-hovering-over-the-map-on-the-explore-observations-page/1461/1) and again in [2023](https://forum.inaturalist.org/t/ideas-for-a-revamped-explore-observations-search-page/8439/274), so it really surprised me that to this day, almost 7 years after the original post, it still hasn’t been fixed.

Revamping this entire page has been on the roadmap for a long time but it is clearly a bottleneck for what could be a much better user experience. My suggestion is at least make some minor CSS changes to solve these issues with the current layout without affecting the DOM.

**Proposed solution:**

For example, fiddling a bit with developer tools I’ve noticed that the map itself is loaded inside an `.obs-container` element with a fixed `height: 550px;`. That height should _ **not** _ be fixed but instead be fluid and scale with the window height by subtracting the heights of the other elements above it (i.e. header/navbar, filters, stats) minus a bit of extra space to reveal some of the page footer so that the user can still scroll the page without the map hijacking the scroll function for zooming in/out. So its new height property would be:

`height: calc(100vh - 57px - 109px - 75px - 100px);`

Then the `#obs` element containing the list of observations should scale as well, so instead of the fixed `height: 420px;` it should also scale vertically. Unfortunately because of the nesting, giving it `height: 100%;` won’t work, so instead you can calculate it dynamically just like above, minus an extra `40px` for the vertical margins around the map edges:

`height: calc(100vh - 57px - 109px - 75px - 100px - 40px);`

With these changes, the map and observation list will scale to _any_ screen size (tested!).

Now the `.container` element has a fixed `width: 1170px;` which comes from Bootstrap, but it that can be overridden to `width: 100%;` so that the map controls and observation list can now shift to the sides of the map, making more working space.

Ideally the observation list wouldn’t become too wide on bigger screens, and I see that its parent element has the typical Boostrap classes `col-xs-4 col-xs-offset-8` , but Bootstrap also offers [other breakpoints](https://getbootstrap.com/docs/5.3/layout/breakpoints/), so for large or extra-large screens you could add `col-xxl-2 col-xxl-offset-10`.

With these suggested changes, here’s how the map view would look like on a 27” 4k display:

 ![inat-map-large-screen-improved](https://us1.discourse-cdn.com/flex016/uploads/inaturalist/original/3X/6/3/63a637435f31d6171ca58bdc30a7f374de1feaf6.jpeg)

---

_[View the full topic](https://forum.inaturalist.org/t/ideas-for-a-revamped-explore-observations-search-page/8439)._
