Question 196494 in Html Question posted in
Some basic documentation can be found here.

Html – css changes not getting reflected

I have made changes in my css file but that changes are not reflecting in my web page but if i apply same changes in browser console then the chages are applied.
What will be the problem?
this is my css code

.packages .box-container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
    gap: 2rem;
}
.packages .box-container .box{
    border: var(--black);
    box-shadow: var(--box-shadow);
    background: var(--white);
}
.packages .box-container .box .image{
    height: 25rem;
    overflow: hidden;
}
.packages .box-container .box .image img{
    height: 100%;
    width: 100%;
    object-fit: cover;
 }
 .packages .box-container .box .content{
    padding: 2rem;
    text-align: center;
}
.packages .box-container .box .content h3{
    font-size: 2.5rem;
    color: var(--black);
}
.packages .box-container .box .content p{
    font-size: 1.5rem;
    color: var(--light-black);
    line-height: 2;
    padding: 1rem 0;
}
.packages .load-more{
    text-align: center;
    margin-top: 2rem;
}
Tags:

2

Answers


  1. 0

    To clear cache:

    For Win CTRL+SHIFT+R

    For MacOS COMMAND+SHIFT+R

    To disable cache you can do something like this (if you are using php)

    <link rel="stylesheet" type="text/css" href="/path-to-file/style.css?ver=<?php echo time()?>"  />

    Dynamic GET paramether ver will make link different on every browser refresh

    Login or Signup to reply.
  2. 0

    Check whether the given css file path is correct or not, in your HTML page Inside Head tag

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search