CSS - changes are not taken into account
Question
I am using Bootstrap to display a list and I am trying to customize its list-item-component .
I have the following code in my CSS file:
.list-group-item {
border:0 !important;
padding-top:2px;
padding-bottom:2px;
}
I reference the CSS file like this:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href="list.css" rel="stylesheet" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Restriction Lists</title>
</head>
<body>
<div id="tree"></div>
<script src="ListApplication.js"></script>
</body>
</html>
The Bootstrap code is in the following file(I am using React).
<script src="ListApplication.js"></script>
Another weird thing is that Chrome Developer Tools does not display the CSS file correctly.
2 answers
solution1
0 2015-10-05 16:54:25
Try with <meta> first:
<meta http-equiv="content-type" content="text/html" charset="utf-8">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href="list.css" rel="stylesheet" type="text/css">
and make sure jquery and bootstrap are coded succesfully in your ListApplication.js
it should work.
solution2
0 2015-10-06 10:28:40
The problem was that I was opening the HTML file from within Webstorm. When I was changing the CSS file, the changes were not loaded into the browser upon refresh.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.