如何将文本框置于ASP面板中心？

Let's say my panel is 200px and i want 5px padding on the left and right, the textbox to be the max size it can (I could calculate it but is there a dynamic way to do this with the browser). The trickier part is how do I get an even amount of padding on top and bottom?

假设我的面板是200px,我想在左右两侧填充5px,文本框是它可以的最大尺寸(我可以计算它但是有一种动态的方式来使用浏览器)。更棘手的部分是如何在顶部和底部获得均匀的填充量?

4 个解决方案

#1

I don't have a way of dynamically sizing the textbox, but if you enclose the textbox in a div, assign the div a height and width and set the margins of that div to auto (margin: auto;), that should work.

我没有动态调整文本框大小的方法,但是如果你将文本框括在div中,请为div指定一个高度和宽度,并将该div的边距设置为auto(margin:auto;),这应该有效。

#2

Here's the code that I used earlier for one of my pages. This is plain HTML, but I guess it should be no trouble for you to modify it for asp controls. Basically the content of the inner div (content) is always positioned in center both vertically and horizontally.

这是我之前为其中一个页面使用的代码。这是纯HTML,但我想你可以毫不费力地为asp控件修改它。基本上,内部div(内容)的内容始终位于垂直和水平的中心。

<div id="container" style="position:relative; height:100px;border:1px solid #000;">
  <div id="content" style="border:1px solid #000; position:absolute; top:50%; left:0px; width:100%; height:20px; margin-top:-10px; text-align:center;">When inserting <b>element</b> here you need to modify <b>height=elementHeight, margin-top=elementHeight/2</b> of the outer div (id="content").</div>
</div>

#3

Make sure you're using a <textarea> element - you should be able to put padding: 5px (or whatever you want) on the container element, then put height: 100% and width: 100% on the textarea.

确保你使用的是元素 - 你应该能够在容器元素上放置填充:5px(或任何你想要的东西),然后在textarea上放置高度:100%和宽度:100%。</p>

Your container element has to have a height though.

你的容器元素必须有一个高度。

I only tested in IE8 and FF3.

我只在IE8和FF3中测试过。

#4

This is something I would've done.


<style type="text/css" >
    .panel{
        padding-left:5px;
        padding-right:5px;
        padding-top:10px;
        padding-bottom:10px;
    }
</style>


<asp:Panel ID="Panel" runat="server" Width="300" CssClass="panel">
        <asp:TextBox ID="TextBox" runat="server" Width="100%" />
    </asp:Panel>

#1