Issue
I must be missing something very small. I have an html table with Bootstrap5 css. I can't get the formatting right. How can I get rid of this black line or format it and the black text to make it to be less bold?
Here's the table header code:
<table id="submissionTable" class="table table-bordered">
<thead>
<tr>
<th class="col-6 text-center">Item Description</th>
<th class="col-3 text-center">Quantity Used</th>
<th class="col-2 text-center">Sold</th>
<th class="col-1 text-center"></th>
</tr>
</thead>
I'm using bootstrap.min.js and my own custom.js right below it in my <head>.
Here's my custom css
tbody, td, tfoot, th, thead, tr {
border-style: none;
}
Solution
I couldn't replicate the black line in the photo, but to change the text weight and style you can do this:
thead th {
font-weight: normal;
}
It is probably better to give the headings their own class and refer to it in the CSS like this:
<th class="col-1 text-center itemtitle">Item Description</th>
.itemtitle {
font-weight: normal;
}
Answered By - lineal Answer Checked By - Timothy Miller (PHPFixing Admin)
Posts
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.