I've noticed that the <input> element in HTML ignores the CSS pair of "left" and "right" properties. Same for the pair "top" and "bottom". See the sample code below:

<html>
    <head>
        <style><!--
        #someid {
            position: absolute;
            left: 10px;
            right: 10px;
            top: 10px;
            bottom: 10px;
        }
        --></style>
    </head>
    <body>
        <input type="text" id="someid" value="something"/>
    </body>
</html>

The <input> should take up almost all space in the browser (except a border of 10px around it). It works fine in Safari, but in FireFox and IE the <input> stays small in the top-left corner of the browser.

If I use "left" and "width", and "top" and "height", then everything works fine. However I don't know what is the width and the height, I want them adjusted depending of the size of the browser window.

Any ideas how to work around this?

Thanks.

Edit
Report