Javascript Tooltip / Posts /

Make Responsive Tooltip smaller popup screens with mobile devices


I've installed it on my client's site and it does a good job. I did try to reduce the tooltip box size using max-wdith but the text was being cut. It's ok on most screens, however it does create an issue on mobile.

How can we have this be responsive in width?

Mathilde  6 years ago   viewed: 4666    

1 Answer


Good question!

You don't need to set max-width. You just need to set a width for smaller devices using media queries of CSS3.

Just open the tooltip.css file, and add the following style:

@media (max-width: 900px) { .mcTooltipWrapper, .mcTooltipInner { width:200px!important; } }

Note: you can surely change the 900px in above code to whatever you prefer such as 800px, 1100px, etc.

  6 years ago


Your name*
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: