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>
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>
look at this question: Input size vs width
I think that is what you are looking for
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.
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.
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>