TransWikia.com

How to override CSS class over input[type]?

Stack Overflow Asked by JohnnyD on December 25, 2021

I am trying to override the input type

input[type="number"] {

  width: 100px;

}

with the following css classes.

.choice_num{
    width: 83px;
    text-align:right;
    padding: 2px;
    font-weight: bold;
}

.choice_num_1{
    width: 82px;
    text-align:right;
    padding: 2px;
    font-weight: bold;
    margin-right: 2px;
}

.float_nums{
    width: 62px;
    text-align:right;
    padding: 2px;
    font-weight: bold;
}

but it doesn’t seem to work. Any ideas?

This is the code that you asked (sorry it didn’t occur to me to add it.)

<input type="number" class="choice_num" step="<?php echo $epilogi['posotita']; ?>" min="<?php echo $epilogi['posotita']; ?>" value="<?php echo $epilogi['posotita']; ?>" onchange="calculate()" id="a1" name="posotita">&nbsp;&nbsp;

<input type="text" class="tmxs" value="KG" readonly="readonly" name="monmetr">&nbsp;&nbsp;

<input type="number" class="choice_num_1" value="<?php echo $epilogi['timi']; ?>" id="a2" readonly="readonly">&nbsp;&nbsp;

<?php } ?>

<input type="number" class="float_nums" value="<?php echo number_format((float)$sum, 2, '.', ''); ?>" id="a3" readonly="readonly">

2 Answers

Just add input before them, like this,

input[type="number"] {
  background-color: orange
}

input.choice_num {
  background-color: blue
}

input.choice_num_1 {
  background-color: green
}

input.float_nums {
  background-color: red
}
<input type="number" />
<input type="number" class="choice_num" />
<input type="number" class="choice_num_1" />
<input type="number" class="float_nums" />

By doing it the specificity of the later selectors increase and thus ur css works,

Answered by aeXuser264 on December 25, 2021

Just add more priority to it. Fast way to do it:

Instead of .choice_num select input.choice_num

Answered by Zdravko Pernikov on December 25, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP