Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Page maximize/minimise

Status
Not open for further replies.

kurie

Programmer
Jun 4, 2008
170
ZA
Hie guys
Im trying to add a table that fills the whole page whether the page is maximized or minimized. but the height is not maximizing only the width is doing that. im using height as 100% and width 100%.
does anyone know whats causing this. Im using .net framework.


Note: I had posted this on the ASP.Net forumn but was advised to use this forumn.
 
Height and width always relate to those of the parent element. However, width is defined to 100% as default for all block level elements and height is by default defined as auto. That means only as high as the content in the element. So if the parent element has no specified height, then it means that it is only as high as the content within it. And 100% of the content within is still only the content within.

You would need to define 100% heights for all the elements preceding your table, including (but not limited to) your html and body elements.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
Hi All
VragaBond, I have tried everytng but nothing seem to work, someone told me to change this line:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
to this line:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
but nochange would u know anything abt this, or something similar
 
I personaly prefer XHTML. Now as for a purely html solution I don't know but here is a css one that I realy like.
Code:
body {
 margin: 0;
}
html, body {
 height: 100%;
}
.wrapper {
 
 min-height: 100%;
 height: auto !important;
 height: 100%;
 margin: 0 auto -142px;
 /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
 height: 142px;
 /* .push must be the same height as .footer */
}
although it takes an extra div for the push
 
kurie, if you do not show us what you tried, then we can't tell you how to fix it. I can only tell you that you shouldn't fix it by destroying your doctype, as the other person suggested.

blackhawkdoc64, I would suggest a simpler code to start with since we don't need to confuse kurie with additional complexities that do not pertain to the issue.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 

Hie guys
I Created a page with one table. i added 2 rows and 2 columns on the table. then i set the width and height to 100%. when i run it only the with expands but the height does.
someone told me to change the lines above but did succed.
I aslo changed the page properties to use 100%, i have tried to clip the boarders with no sucess.
Thank you
 
kurie, that's all very nice and hardly any more information than first time around. Could you please show us the code? Here's the facts:

1. If you remove the doctype, most browsers (operating in quirks mode) should display the table as 100% high. However, this is not something I would recommend doing.

2. If you add 100% heights to all parent elements of the table, the table should display as 100% high.

These are the facts and if you do any of them and your page is valid, it should display correctly. Since it apparently is not, there is something wrong with your code -- the code you're still reluctant to show us.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
Good Day
Please find attached one of my webpages failing to maximize.
 
here is the page again:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "<html xmlns="<head runat="server">
<title>Intelligent Thinking Key Generator</title>
</head>
<body style="padding-right: 0%; padding-left: 0%; padding-bottom: 0%; margin: 0%; padding-top: 0%">
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<table style="width: 100%">
<tr>
<td style="width: 772px; height: 23%; background-color: gray;">
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;<a href="../Generator/frmMain.aspx">Home</a>
&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; <a href="../Generator/frmMain.aspx">Logout</a></div>
</td>
<td style="height: 23%">
</td>
</tr>
<tr>
<td style="width: 100%; height: 21%; background-color: lightsteelblue;">
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<asp:Label ID="lblGenerate" runat="server" Font-Bold="True" Font-Names="Tahoma" Font-Size="Small"
Font-Underline="False" Text="Generate Keys" Width="185px"></asp:Label></td>
<td style="height: 21%">
</td>
</tr>
<tr>
<td style="width: 772px; background-color: lightsteelblue; height: 21%;">
</td>
<td style="height: 21%">
</td>
</tr>
</table>
<div>
<table style="width: 718px">
<tr>
<td style="width: 18px; height: 100%; color: lightsteelblue; background-color: lightsteelblue;">
<span style="color: #336699; background-color: lightsteelblue; height: 100%;">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<telerik:RadPanelBar ID="pnlAdd" runat="server" Skin="Outlook" Width="150px">
<CollapseAnimation Duration="100" Type="None" />
<Items>
<telerik:RadPanelItem runat="server" Text="User">
<Items>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\AddUsers.aspx" Text="Add User">
</telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\EditUsers.aspx" Text="Edit User">
</telerik:RadPanelItem>
</Items>
</telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" Text="Company">
<Items>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\AddCompany.aspx" Text="Add Company">
</telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\EditCompany.aspx"
Text="Edit Company">
</telerik:RadPanelItem>
</Items>
</telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" Text="Generate Key">
<Items>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\Default.aspx" Text="Assign Key">
</telerik:RadPanelItem>
<telerik:RadPanelItem runat="server" NavigateUrl="..\Generator\Viewkey.aspx" Text="View Key">
</telerik:RadPanelItem>
</Items>
</telerik:RadPanelItem>
</Items>
<ExpandAnimation Duration="100" Type="None" />
</telerik:RadPanelBar>
<br />
</span>
</td>
<td style="height: 100%; width: 436px;">
<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Height="100%" Width="434px">
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<br />
<br />
<br />
<br />
<table style="width: 427px; height: 100%;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 96px">
<asp:Label ID="Label10" runat="server" Text="Company" Width="64px" Font-Bold="False" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
<td style="width: 359px">
<telerik:RadComboBox ID="cboCompany" runat="server" OnSelectedIndexChanged="cboCompany_SelectedIndexChanged"
Width="220px" AutoPostBack="True" Font-Names="Tahoma" Font-Size="Small">
<CollapseAnimation Duration="200" Type="OutQuint" />
</telerik:RadComboBox>
</td>
</tr>
<tr>
<td style="width: 96px">
<asp:Label ID="Label7" runat="server" Text="No Of Users" Font-Bold="False" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
<td style="width: 359px">
<telerik:RadTextBox ID="tboUsers" runat="server" Width="215px" Font-Names="Tahoma" Font-Size="Small">
</telerik:RadTextBox>&nbsp;<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server" ControlToValidate="tboUsers" Display="Dynamic" ErrorMessage="Required Field">*</asp:RequiredFieldValidator></td>
</tr>
<tr>
<td style="width: 96px">
<asp:Label ID="Label8" runat="server" Text="Product" Font-Bold="False" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
<td style="width: 359px">
<telerik:RadComboBox ID="cboProduct" runat="server" Width="217px" AutoPostBack="True" OnSelectedIndexChanged="cboProduct_SelectedIndexChanged" Font-Names="Tahoma" Font-Size="Small" >
<CollapseAnimation Duration="200" Type="OutQuint" />
</telerik:RadComboBox>
</td>
</tr>
<tr>
<td style="width: 96px; height: 6%;">
<asp:Label ID="Label9" runat="server" Text="Key" Font-Bold="False" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
<td style="height: 6%; width: 359px;">
<telerik:RadTextBox ID="tbokey" runat="server" Width="213px" ReadOnly="True" Font-Names="Tahoma" Font-Size="Small">
<ReadOnlyStyle BackColor="#FFFFC0" />
</telerik:RadTextBox>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
</td>
</tr>
<tr>
<td style="width: 96px; height: 6%">
<asp:Label ID="Label1" runat="server" Text="Activation Code" Width="103px" Font-Bold="False" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
<td style="width: 359px; height: 6%">
<telerik:RadTextBox ID="tboActivation" runat="server" ReadOnly="True" Width="214px" Font-Names="Tahoma" Font-Size="Small">
<ReadOnlyStyle BackColor="#FFFFC0" />
</telerik:RadTextBox></td>
</tr>
<tr>
<td style="width: 96px; height: 6%">
</td>
<td style="height: 6%; width: 96px;">
<asp:Label ID="lblInfor1" runat="server" ForeColor="Red" Width="302px" Font-Names="Tahoma" Font-Size="Small"></asp:Label></td>
</tr>
<tr>
<td style="width: 96px; height: 10%">
</td>
<td style="height: 10%; width: 359px;">
<asp:Button ID="BtnGenerate" runat="server" Text="Generate Key" Width="99px" OnClick="BtnGenerate_Click" Font-Names="Tahoma" Font-Size="Small" /></td>
</tr>
</table>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<br />
<br />
&nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp;</telerik:RadAjaxPanel>
<br />
</td>
<td style="height: 100%; width: 379px;">
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
 
Can you provide the client code (the actual HTML produced) not the server code

___________________________________________________________
If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller
Steam Engine Prints
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top