Hi @pettrushkov
Can you share the link to your page so I can check which approach would work better? Seems your image is quite big and maybe you would need some custom css to make the tooltip image smaller on mobile.
Greetings, Carlos
Hi @carlosmoreirapt
Thanks for answer, i tried to remove image from tooltip, but width remained the same (local) – https://take.ms/XBbhn. Page url to view (width image) – http://suweidi.markupus.tech/contact/
You can try adding this css to your site:
@media only screen and (max-width:780px) {
.imapsTooltip img,
.imapsTooltip {
max-width:150px !important;
}
.imapsTooltip * {
font-size:1em !important;
}
.map_wrapper foreignObject {
max-width:150px !important;
}
}
But you’ll also need to add some line breaks (<br>) to have the tooltip more compact.
This code not resolve problem – it was ignored.. I tried something similar earlier. https://take.ms/NFeo3
Adding line breaks to tooltip also failed https://take.ms/SA4ER
Hi @pettrushkov
I just visited the page and I don’t see the custom css in the source code, but it seems the line breaks are now working correctly?
Greetings, Carlos
Hi @carlosmoreirapt
Yes, I made line-breaks in source code and it work correct.
But I have new question – I have big line-height with line breakers, can I change it? Rules like .contact__map * { line-height: 1; } – don’t work
You should be able to control it with this rule:
.imapsLabel foreignObject {
line-height:1em !important;
}
Greetings, Carlos
