I'm testing Tailwind CSS, and I'm facing this issue. It was working before and it's still working in some cases, but on this line below its inverting the breakpoints somehow. See the screenshots below
Example code:
<h1 className='sm:text-4xl text-8xl'>
AndiiCodes<span className="dot">.</span>
</h1>
Full screen (text should be 8xl, but it's taking the sm:
size of 4xl): screenshot
Medium/small screens: screenshot
tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}",
'node_modules/flowbite-react/**/*.{js,jsx,ts,tsx}',
],
theme: {
extend: {},
},
plugins: [
require('flowbite/plugin'),
],
}
CSS file
@tailwind base;
@tailwind components;
@tailwind utilities;
I also tried to set a base font size first then change it on other screens, but I'm still running into the same issue.
Via Active questions tagged javascript - Stack Overflow https://ift.tt/gwQANlT
Comments
Post a Comment