CODEWITHSUNDEEP
csscss-selectorsdisplayinline-styles
Radek
Radek

Reputation: 11121

how to overwrite `display: none` for checkbox?

Currently at this web page there is a table

It looks like the default template of the web got in CSS

input[type="checkbox"], input[type="radio"] {
    display: none;
}

Now the checkboxes are not visible - see enter image description here

But if I uncheck the display: none then the checkboxes are visible.

Is there any way I can make them visible in html using style when creating the checkbox? I do not have the permission to edit css. I can add custom css though.

Upvotes: 0

Views: 2275

Answers (2)

Dwhitz
Dwhitz

Reputation: 1270

The short answer is yes, you can add an inline css in order to show the checkbox.

Just add one of the following style="display: inline-block;" or style="display: block;" based on your needs.

This because of css priority, the inline css has the most priority.

Demo 

input[type="checkbox"],input[type="radio"]{display: none;}
<table>
<tr>
  <td> Balance
  <input type="checkbox" style="display: inline-block;">
  </td>
  <td>Element 2 </td>
</tr>

</table>

Upvotes: 2

Johannes
Johannes

Reputation: 67778

Most likely these should be inline-blocks when visible (i.e. not taking the whole width of their parent), so you can add the attribute style="display: inline-block" to those HTML tags.

Upvotes: 3

Related Questions