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  one year ago   viewed: 1639    

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.

  one year 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: