Use different css for input type text and checkbox

Question

I'm getting trouble when i try to change the width of my input checkbox.

all inputs are width:200px (text, button, checkbox). But i need a width:20px only for checkbox.

Is it possible?

zenkaty · Accepted Answer · 2012-08-02 00:36:52Z

2

You can use:

input[type="checkbox"] {width:20px}

but this is not completely browser compatible. All browsers will recognise if you add a class to your checkboxes, ie.

<input type="checkbox" class="checkbox" />

then use:

.checkbox {width:20px}

answered Aug 2, 2012 at 0:13

zenkaty

1,5489 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

voodoo417 · Accepted Answer · 2012-08-02 00:09:15Z

1

input[type=checkbox] { width: 20px; }

answered Aug 2, 2012 at 0:09

voodoo417

12.2k3 gold badges39 silver badges43 bronze badges

that is correct notation, but not works :) It will set width to 20px, but not visually. Try it, looks like added margins.

I paste it in my form.css file, but nothing happen

Miljan Puzović · Accepted Answer · 2012-08-02 00:10:27Z

1

You can set via CSS smaller size than default for checkbox but not larger. If you want to increase size of checkbox, you'll need jquery. Example LINK

answered Aug 2, 2012 at 0:10

Miljan Puzović

5,8201 gold badge26 silver badges30 bronze badges

I will take a look, interesting custumized forms