Css File not loading properly in laravel - css

Question

This is the inspect css file of the button whose background color is not changing. I changed it in the original file but after inspecting it shows the same
select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px;
}
this is my original file:
.select2-selection__choice {
border:1px solid #aaa;
border-radius:4px;
cursor:default;
float:left;
margin-right:5px;
margin-top:5px;
padding:0 5px
}
But why it keep loading that background color !!!

Answer 1

If you changed the styles in the original file that means - css is changed but browser can't render that. It renders the old cache files.
Possible solution: Refresh the cache of your browser and in my 90% case problem had solved.
Other possibilities of not showing css styles:
Sometimes we need to override any style and we write and link that. Here, link need to be in last.
That means- we have select2.css and main.css
in select2 there is something like
.test{
padding: 10px;
}
And we want to override that in our main.css like,
.test{
padding: 20px;
}
Then we've to follow the order of styles linkings. Like first add select2.css and then add main.css
<link rel="stylesheet" href="select2.css" />
<link rel="stylesheet" href="main.css" />
We also do that by adding !important of that style
.test{
padding: 10px!important;
}
Thus main.css's test class can't override the select2 's test class.
Hopefully you've cleared now about this..