Geek asks and answers

In HTML, how can I get an input box for an extension in IE8?

I downloaded the following simple HTML code at http://losthobbit.net/temp/anchor.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Anchor Test</title>
</head>
<body>
    <div style="width:100%;height:100%">
        <input maxlength="250" type="text" name="Text2" id="Text2" style="position: absolute;
                top: 13px; left: 265px; right: 15px; height: 20px; text-align: Left">
    </div>
</body>
</html>

As you can see, I indicated left and right, but not width, to stretch it.

In Chrome, it stretches when the browser is resized, but this does not work in IE8 or FireFox. Any ideas on how I can fix this?

thank

Please note that people suggest using percent width ... unfortunately, this does not solve my problem. I want the exact same behavior that I have in Chrome, that is, in the left and right anchors. This means that stretching is not a fixed percentage.

+3
source share
3 answers

<input> , <input> width:100%.

<div style="width:100%;height:100%">
  <span style="position: absolute; top: 13px; left: 265px; right: 15px; height: 20px; text-align: Left">
    <input maxlength="250" type="text" name="Text2" id="Text2" style="width:100%; height:100%;">
  </span>
</div>

: http://jsbin.com/ayiwa5

+6

<input type="text" /> IE firefox.

. jsfiddle: http://jsfiddle.net/LKnJT/2/

, .

. style="width:100%;height:100%" div, Chrome .

[Update]
: http://jsfiddle.net/LKnJT/5/. IE. .

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Anchor Test</title>
    </head>
    <body>
        <div style="position:absolute;left:150px;right:20px;">
            <input maxlength="250" type="text" name="Text2" id="Text2" style="text-align:left;width:100%">
        </div>
    </body>
</html>
+2

? , :

width: 40%;

UPDATE:

:

float: right;
width: 80%;

, clear float .

+1
source

More articles:


All Articles