i'm using ASP, having one very simple template, in my lang, wanna put div inside of td cell which should be 100% of height... it's important to use inner DIV, and not setting on TD itself, casue there will be a master page same to this one, which some time content will have background and some time not...
我正在使用ASP,有一个非常简单的模板,在我的lang中,想把div放在td单元格中,这应该是100%的高度...使用内部DIV很重要,而不是设置TD本身,casue会有是一个与此相同的母版页,有些时候内容会有背景,有些时候不会......
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="admin_login.aspx.cs" Inherits="admin_login" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > <!-- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Admin Section</title>
<link href="~/css/admin.css" type="text/css" rel="stylesheet"/>
<script type="text/javascript" language="javascript" src="js/height.js"></script>
<script type="text/javascript" language="javascript">
function onLoad() {
makeInnerOneHundredPercentage("outterMainDivElement", "innerMainDivElement");
}
$(document).ready(onLoad());
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="main-div">
<table class="main-table">
<tr>
<td class="pg-hdr">
ورود<br />
<br />
<div class="main-link-div">
<asp:HyperLink ID="HyperLink1" runat="server">خانه</asp:HyperLink>
</div>
<div class="main-link-div-alt">
</div>
</td>
</tr>
<tr>
<td id="outterMainDivElement">
<div id="innerMainDivElement" class="big-background">
<div align="center">
<asp:Login ID="Login1" runat="server" BackColor="#EFF3FB" BorderColor="#B5C7DE"
BorderPadding="4" BorderStyle="Solid" BorderWidth="1px" Font-Names="tahoma"
Font-Size="0.8em" ForeColor="#333333"
FailureText="تلاش برای ورود موفقیت آمیز نبود، لطفا مجددا تلاش کنید."
LoginButtonText="ورود" PasswordLabelText="کلمه عبور:"
PasswordRequiredErrorMessage="کلمه عبور ضروری می باشد."
RememberMeText="من را به خاطر بسپار" TitleText="ورود"
UserNameLabelText="نام کاربری:"
UserNameRequiredErrorMessage="نام کاربری ضروری می باشد." RememberMeSet="False" CheckBoxStyle-Wrap="True">
<InstructionTextStyle Font-Italic="True" ForeColor="Black" />
<LoginButtonStyle BackColor="White" BorderColor="#507CD1" BorderStyle="Solid"
BorderWidth="1px" Font-Names="Verdana" Font-Size="1em"
ForeColor="#284E98" />
<TextBoxStyle Font-Size="0.8em" />
<TitleTextStyle BackColor="#507CD1" Font-Bold="True" Font-Size="1.5em"
ForeColor="White" />
</asp:Login>
</div>
</div>
</td>
</tr>
<tr>
<td class="pg-ftr">
<p dir="rtl" style="padding: 0px; margin: 0px;">
تمامي حقوق مطالب اين وب سايت براي حسن فقیهی محفوظ است.
</p>
<p dir="ltr" style="padding: 0px; margin: 0px; font-family: Times new roman;">
© 2011 by Hassan Faghihi.</p>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
i also tried to write JS... but it seem not to work, please take a look....
我也试着写JS ......但似乎没有用,请看看....
function makeInnerOneHundredPercentage(outterId, innerId){
var h= Document.getElementById(outterId).height;
document.getElementById(innerId).height=h;
}
here's my CSS file
这是我的CSS文件
body,html {
direction: rtl;
height: 100%;
margin: 0;
min-height: 100%;
padding: 0;
}
body > form{
height: 100%;
min-height: 100%;
}
* {
font-family: tahoma;
}
.big-background{
height: 100%;
min-height: 100%;
margin: auto;
padding: 0;
background-image: url("../img/style/10.jpg");
background-repeat: repeat;
}
.main-div {
min-height: 100%;
height: 100%;
padding: 0px;
margin: 0px;
}
.main-table {
width: 100%;
min-height: 100%;
height: 100%;
padding: 0px;
margin: 0px;
}
.pg-hdr{
height: 100pt;
text-align: center;
vertical-align: top;
font-family: tahoma,arial;
font-size: 36px;
font-style: normal;
font-weight: bold;
color: #f9f6ff;
background-color: #a694ff;
}
.pg-ftr{
height: 50pt;
text-align: center;
font-family: tahoma,arial;
font-size: 14px;
font-style: normal;
color: #f9f6ff;
background-color: #a694ff;
}
.main-link-div ,
.main-link-div-alt{
font-size: 16px;
}
.main-link-div {
width: 100px;
float: left;
}
.main-link-div-alt{
width: auto;
float: right;
}
.main-link-div > a:hover,
.main-link-div-alt > a:hover {
color: red;
}
.main-link-div > a:active,
.main-link-div-alt > a:active {
color: #ffd700;
}
.content-place-holder-td {
text-align: center;
vertical-align: top;
}
.content-place-holder-td > * {
margin: 0 auto;
}
1 个解决方案
#1
0
Add this style in your css file (background color is only for testing, u can delete it later)
在css文件中添加此样式(背景颜色仅用于测试,您可以稍后删除)
.big-background{
height: 100%; background-color: #ccc}
#1
0
Add this style in your css file (background color is only for testing, u can delete it later)
在css文件中添加此样式(背景颜色仅用于测试,您可以稍后删除)
.big-background{
height: 100%; background-color: #ccc}