如何在浏览器滚动和调整大小期间保留文本框

时间:2014-08-11 20:17:23

标签: css jsp textbox

我只是不知道还能做什么。需要别人的帮助。我有一个文本框,它应该与内容ID相关。但是,当我运行并尝试在浏览器窗口中滚动时,该框被固定到浏览器窗口,即使滚动时也不会移动。它应该修复我设置的img id。图像正在移动,但文本框不是。我该如何解决这个问题?

这基本上就是我使用的代码。

singledose.jsp

<form method="GET" action="SingleDose" id="searchform">
    <div id="container">

        <div id="header2">
            <h2>Single Dose Model</h2>
        </div>

        <div id="content">

            <div id="picture">
                <div id="img">
                    <img alt="PK Diagram" src="PKdiagram1.jpg">
                </div>
                <div id="parameter">
                    <input type="text" name="ka_Central" class="ka_Central"
                        id="ka_Central" value="<%=ka_Central%>" /> <input type="text"
                        name="k12" class="k12" id="k12" value="<%=k12%>" />
                </div>
            </div>
            <div id="webfigure">
                <jsp:include page="dose.jsp"></jsp:include>
            </div>
        </div>
    </div>
</form>

dosestyle.css

img {
    float: left;
    width: 550px;
    height: 275px;
    position: relative;
    top: 69px;
    width: 550px;
}
#container {
    background-color: white;
    width: 1300px;
    margin-left: auto;
    margin-right: auto;
}
#header2 {
    background-color: #66CCFF;
    color: white;
    text-align: center;
}
#content {
    padding: 0px;
}
#parameter {
    width: 70%;
    position: fixed;
    top: 30px;
    left: 82px;
    float: left;
}
.ka_Central {
    background-color: #FFFF88;
    border: 1px solid #008000;
    width: 50px;
    text-indent: 0px;
    position: relative;
}
.k12 {
    background-color: #FFFF88;
    border: 1px solid #008000;
    width: 50px;
    position: absolute;
    top: 315px;
    left: 385px;
}

希望有人可以提供帮助。谢谢!

1 个答案:

答案 0 :(得分:0)

首先,我不是程序员,只是一个新手。请不要期待非常技术性的编程答案。这只是为了分享我的所作所为。

我实际上已经尝试到处搜索答案,但发现的所有相同问题都没有得到解答。基本上,这就是我所做的。非常简单。我刚删除#parameter函数并将所有文本框位置更改为position: relative

与其他问题一样,我们忘记从position(在这种情况下为#parameter)中取出parent element格式。我认为1个工作只能由1个元素完成,无论是孩子还是父母本身。或者可能还有其他一些方法没有出现在我的脑海中。我已经对其他部分进行了反复试验,并且它的工作方式相同。一旦我从parent element删除了位置格式,tadaaaa !!!完成..;)