Try to inspect element the table and check if your border: 1px solid black; applies to the element (on inspect element window, on css box, make sure the text isn’t in strikethrough), if the text is in strikethrough, try adding !important keyword next to black and before ;.
Solution 1 :
Solution 2 :
Your CSS gets applied to the table elements, you can check it with the developer tools in your browser.
Also a running example of your table:
h1 {
color: red;
}
table,
td,
th {
border: 1px solid black;
}
table {
border-collapse: collapse;
}<h1>Here are your patient records:</h1>
<h2>Go to /formpage to fill the form</h2>
<table>
<thead>
<th>Patient Name</th>
<th>Identity Document Number</th>
<th>Date of Birth</th>
<th>Date Case Confirmed</th>
<th>Case Number</th>
</thead>
<tbody>
<tr>
<td>name</td>
<td>idn</td>
<td>date_of_birth</td>
<td>confirm_day</td>
<td>case_no</td>
</tr>
<tr>
<td>name</td>
<td>idn</td>
<td>date_of_birth</td>
<td>confirm_day</td>
<td>case_no</td>
</tr>
<tr>
<td>name</td>
<td>idn</td>
<td>date_of_birth</td>
<td>confirm_day</td>
<td>case_no</td>
</tr>
</tbody>
</table>Problem :
Here is a part of my HTML code.
<link rel="stylesheet" href="{% static "css/mystyle.css" %}"/>
</head>
<body>
<div class="container">
<div class="jumbotron">
<h1>Here are your patient records:</h1>
<h2>Go to /formpage to fill the form</h2>
{% if patients %}
<table>
<thead>
<th>Patient Name</th>
<th>Identity Document Number</th>
<th>Date of Birth</th>
<th>Date Case Confirmed</th>
<th>Case Number</th>
</thead>
{% for pat in patients %}
<tr>
<td>{{ pat.name }}</td>
<td>{{ pat.idn }}</td>
<td>{{ pat.date_of_birth }}</td>
<td>{{ pat.confirm_day }}</td>
<td>{{ pat.case_no }}</td>
</tr>
{% endfor %}
</table>
I want to edit the table according to my CSS rules.
h1{
color: red;
}
table, td, th{
border: 1px solid black;
}
table {
border-collapse: collapse;
}
However, the table does not respect the changes from CSS. Funny thing is, h1 header is actually following the CSS rule and is red.
What am I missing?
Comments
Comment posted by Fabrizio Calderan
what do you expect from the code and what is your actual output?