Add scroll bar to the location description (for long descriptions)

Add this code to the Custom CSS field on the Appearance tab of your Google Maps widget’s settings:

.global-styles,
:root {
--max-lines: 4;
}

.eapps-google-maps-marker-description {
line-height: 15.6px;
max-height: calc(15.6px * var(--max-lines));
overflow: auto;
}

.eapps-google-maps-marker-description::-webkit-scrollbar {
width: 6px;
}

.eapps-google-maps-marker-description::-webkit-scrollbar-thumb {
background-color: rgba(184, 45, 45, 0.3);
border-radius: 10px;
}

.eapps-google-maps-marker-description::-webkit-scrollbar-thumb:hover {
background-color: rgba(184, 45, 45, 0.5);
}

In the 3rd line of the code, you should set the number of lines to display :slightly_smiling_face:

1 Like