'Tailwindcss not taking effect when i use it in html file

I have installed tailwindcss using PostCSS. However it's not taking effect when i try to use it to style my html.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/dist/output.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <title>Home Page</title>
</head>

Here is the output in tailwind.config.js:

module.exports = {
  content: ["./src/**/*.{html,js}"],
  theme: {
    extend: {},
  },
  plugins: [],
}
htmltailwind-css


Solution 1:[1]

i changed the path to ../dist/output.css

<link href="../dist/output.css" rel="stylesheet">

it is not properly pointing to the right output.css file location

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions