2

Is it possible to set an elements size attribute with CSS? So this:

<input type="text" name="email" size="35">

Would effectively become this:

<input type="text" name="email" size="40">

enter image description here

This is different to setting the width in pixels as I want the browser to render the input based on the size attribute, not use an exact pixel width.

5
  • Can you tell us what's the difference of the two? Commented Apr 17, 2014 at 13:22
  • size="35" vs size="40". Ive added a screenshot to my question. Commented Apr 17, 2014 at 13:25
  • I don't quite know why you are trying to use the attribute over css but have you tried using "em" and not "px"? But a browser doesn't render things differently if they are scaled with css. Commented Apr 17, 2014 at 13:35
  • You should use units. Even if you don't, these numbers will find themselves one. Do you want a "35 teemo" sized text? (By the way this comment is not just about css, size must have a unit in anywhere.) Commented Apr 17, 2014 at 13:38
  • The size attribute determines the default width if the element is inside a parent with display: flex; before grow or shrink are applied. This could be a valid reason to want this. Specifying an explicit width might not have the same effect. Commented Nov 21, 2019 at 21:06

2 Answers 2

7

No, you cannot set any attributes in CSS. Attributes belong to elements; CSS deals with the rendering of elements and may use the attributes in certain ways, but not set or change them.

Consider presenting the actual problem you are facing, instead of assumed (and dead-end) approach to an unspecified problem. There are several units that you can use in setting the width property of an element, not just px. But if you are looking for a unit corresponding to the width of a character, as I suspect, then what comes closest is the ch unit (e.g., width: 40ch), but (a) it is defined as the width of the digit 0, and it’s just somewhat close to the average width of characters and (b) support isn’t universal yet.

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

Comments

1

There semantic meaning to "size=n". It's not only how to see the page, but also what the excepted length (in chars) of the input data.

the attribute "style" is only to set visual options.

<!DOCTYPE html>
<html lang="en">
    <head>
        <title> Bla! </title>
    </head>
    <body>
        <input type='text' style='width:20px'> px<br>
        <input type='text' style='width:20pt'> pt<br>
        <input type='text' style='width:20ex'> ex<br>
        <input type='text' size='20'> size = 20 <br>
        <input type='text' style='width:20em'> em <br>
        <input type='text' style='width:20pc'> pc<br>
        <input type='text' style='width:20cm'> cm<br>
        <input type='text' style='width:20in'> in<br>
    </body>
</html>

1 Comment

What is here the answer to the question asked?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.