1

How to make all <input text field to size of 50 ?

I have been using

<table>
<tr>
...
<input type="text" size="50" ...>

But this is too much typing .
How can I include this style to <style>

i tried

<style>
input 
{
size:100
}
</style>
Buras
  • 3,069
  • 28
  • 79
  • 126

5 Answers5

1

CSS can affect the width but not the size. You could have javascript or jQuery come back through on page load and do it, though.

In jQuery you could use:

<script>
  $(function() {
    // Document is ready / loaded
    $("input").attr("size", "60");
  });
<script>
Gavin42
  • 490
  • 8
  • 19
1

look at this question: Input size vs width

I think that is what you are looking for

Community
  • 1
  • 1
jBear Graphics
  • 153
  • 1
  • 7
1

The size attribute specifies the suggested visible width of the control, using “average” width characters. This is a vague concept and implemented inconsistently in browsers. There is no way to replicated this behavior in CSS.

What comes closest is using the ch unit, which formally denotes the width of the digit “0” but can in practice be taken as an approximation of “average-width character”. So you could set

 input { width: 50ch }

In practice, there is also the problem that the ch unit is not supported by many browsers still in use (mainly IE 8 and older).

The conclusion is that you should keep using the size attribute.

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
0

Size is an attribute not Style component. So you cannot set it with CSS. Instead you can use width -

<style>
input 
{
    width: 150px;
}
</style>

just use a trial and error way to determine how much is it in px for size 50 then use it as the width.

brainless coder
  • 6,310
  • 1
  • 20
  • 36
0

Make sure to define in the style only text inputs. Also 311px is the size of a size="50" text input

<style>
input[type=text] {
width:311px;
}
</style>
Spencer May
  • 4,266
  • 9
  • 28
  • 48