How to hide map elements using CSS

GravityView’s Google Maps implementation include several optional controls. Depending on your layout, design, or user experience goals, you may want to hide some of them.

This guide shows how to hide specific map controls using CSS, so you can remove only what you don’t need and keep everything else working as expected.

Choose what you want to hide

You can hide each control independently. Use only the CSS rules for the controls you want to remove.

Hide “Search as map moves” and “Redo search in map”

Hide these if you want search results to stay fixed unless users explicitly change filters or reload the page.

/* Hide redo search checkbox */
.gv-map-canvas .gk-maps-element-search,
.gv-map-canvas .gk-maps-element-redo-search {
    display: none!important;
}

Adjust or hide the full-screen button

When the redo search controls are hidden, the full-screen button may need repositioning. You can move it to the top, or hide it entirely.

/* Hide redo search checkbox */
.gv-map-canvas .gk-maps-element-search,
.gv-map-canvas .gk-maps-element-redo-search {
    display: none!important;
}

/** Move "Full-screen" control after hiding redo search */
.gv-map-canvas .gm-control-active.gm-fullscreen-control {
    top: 0!important;
}

Hide the pan (up/down/left/right) controls

Hide these if you want users to pan only by dragging the map.

/** Hide the little map up/down/left/right controls */
.gv-map-canvas gmp-internal-camera-control {
    display: none;
}

Hide the Street View pegman

Hide this if Street View is not relevant to your use case.

/** Hide the little Street View doll */
.gv-map-canvas .gm-svpc {
    display: none;
}

Hide the Map / Satellite (terrain) switcher

Hide this if you want to lock users into a single map style.

/** Hide the Terrain switcher (Map/Satellite) */
.gv-map-canvas .gmnoprint {
    display: none;
}

Where to add this CSS

You may add this CSS to a specific View using the Custom Code setting.

Notes and troubleshooting

These styles apply only to GravityKit maps and won’t affect other Google Maps on your site.
Google occasionally updates its map markup. If a control reappears after an update, the CSS selector may need to be adjusted.
If you want to hide a control not listed here, contact GravityKit support with a screenshot of the map and the control you want to remove.