<script> window.MonsidoCookieOnShow = function () { setTimeout(function () { var button = document.querySelector('mon-cb-main').shadowRoot.querySelector('mon-cb-home').shadowRoot.querySelector('mon-cb-button').shadowRoot.querySelector('button'); button.innerText = 'cookies'; // change text button.style.color = 'red'; //change color of the text button.style.width = '100px'; // change size of the button button.style.height = '10px'; // change size of the button button.style.fontSize = '20px'; // change size font of the text }); } </script>
The text height and width cannot be directly controlled using CSS, as text will always adjust to the size and shape of the container in which it is placed. However, you can control the height and width of the container (in this case the button) and set the font-size, line-height and letter-spacing properties to adjust the height and width of the text.
For example, if you want to make the text taller, you can increase the line-height
of the text. If you want to make the text wider, you can increase the letter-spacing
. Also, you can control the width of the text by adjusting the width of the container and setting the text-overflow
property to ellipsis
to truncate the text if it overflows the container
button.style.lineHeight = "40px"; // sets the line height of the text to 40px button.style.letterSpacing = "5px"; // increases the spacing between letters button.style.textOverflow = "ellipsis"; // truncates the text if it overflows the container
How to hide "Powered by Monsido" from cookie banner using CSS:
a.acc-link { display: none; }