Search code examples
cssfirefoxconsole

some CSS property working on chrome's console but not on firefox


this is my code,

console.log('%c Hello, World!', 'background:linear-gradient(45deg,#FF0099,#493240);padding:5px;font-weight:900;border-radius:5px;')

border-radius, padding-block border-radius not working on firefox as the image

enter image description here

but it's working fine on chromium

enter image description here

do I have to enable something? or firefox is just limited?


Solution

  • Firefox treats messages as inline elements. You should set display: inline-block to get the desired behavior. (reference: https://developer.mozilla.org/en-US/docs/Web/API/console#sect4)