CODEWITHSUNDEEP
htmlcss
John John
John John

Reputation: 1

Changing the table cells font to be bold

I am working with a web template which I download. So I define a table such as:- table class="table table-striped table-bordered bootstrap-datatable datatable">

<thead>
<tr>
<th></th> <th></th>
 </tr></thead>
<tbody> 
 <tr> 
        <td class="center" >
     @Html.LabelFor(model => model.AccountDefinition.ORG_NAME) 


        </td>
        <td>@Html.DisplayFor(model => model.AccountDefinition.ORG_NAME)</td>
    </tr>
    <tr> 
        <td class="center">
         @Html.LabelFor(model => model.AccountDefinition.LOGIN_URI)


        </td>

I search the template for .center class, but I can not find any other reference to .center except insidethis

div.center,p.center,img.center{
margin-left: auto !important;
margin-right: auto !important;
float:none !important;
display: block;
text-align:center;

}

So I added 

font-weight:bold

to the above css so it looks as:-

div.center,p.center,img.center{
margin-left: auto !important;
margin-right: auto !important;
float:none !important;
display: block;
text-align:center;
font-weight:bold;

}

But still the table cells font will not be bold? Any idea about how to fix it? BR

Upvotes: 8

Views: 27035

Answers (2)

Code Lღver
Code Lღver

Reputation: 15603

You have applied the bold style to div, p and img tag. And you are using it into td tag so change the following line:

div.center,p.center,img.center{

with this:

div.center,p.center,img.center,td.center{

EDITED:

If you want to make the text align center and bold that then add the below css in your css code:

td.center{
  text-align:center;
  font-weight:bold;
}

Upvotes: 6

MrCode
MrCode

Reputation: 64526

The CSS selector that you have, doesn't apply to <td> elements. As you can see from the selector, it only applies to <div>, <p> and <img/> elements. You could add this:

td.center {
    text-align:center;
}

Or add it to the existing CSS selector:

div.center, p.center, img.center, td.center {
    margin-left: auto !important;
    margin-right: auto !important;
    float:none !important;
    display: block;
    text-align:center;
}

Upvotes: 1

Related Questions