Tuesday, March 13, 2012

Simple Footer problem

This isn't an ASP.NET question as such.

I need to design a page with the following:

header of 60 px height

content which scales

footer of 60 px height.

I need the footer to sit at the bottom of the page, but i keep getting a
line underneath the footer when viewing in FireFox. If i remove the form
tag then this works fine. Please could someone advise me on the best way to
do the layout. I'm not opposed to using divs, but i need cross-browser
ability.

Many thanks.Are there form elements in your header and footer? If not, you could
just move the <form></form> stuff inside the main content cell. I
tried this:

<body>
<table cellspacing="0" cellpadding="0" border="1" width="100%">
<tr height="60">
<td>Header Goes Here</td>
</tr>
<tr>
<td>
<form id="Form1" method="post" runat="server">
Main Content<br>
</form>
</td>
</tr>
<tr height="60">
<td>Footer Goes Here</td>
</tr>
</table>
</body
I don't see any empty space under the table when I make the content
cell large enough to make the page scroll.

-Phil
Thanks Phil,

I guess it's an issue with the way in which FireFox displays Form items.
This method will work, although if anyone knows how to do the same with div,
then I'd appreciate knowing.

Thanks.

"Phillip Ian" <phlian@.comcast.net> wrote in message
news:1120222948.760104.230450@.f14g2000cwb.googlegr oups.com...
> Are there form elements in your header and footer? If not, you could
> just move the <form></form> stuff inside the main content cell. I
> tried this:
> <body>
> <table cellspacing="0" cellpadding="0" border="1" width="100%">
> <tr height="60">
> <td>Header Goes Here</td>
> </tr>
> <tr>
> <td>
> <form id="Form1" method="post" runat="server">
> Main Content<br>
> </form>
> </td>
> </tr>
> <tr height="60">
> <td>Footer Goes Here</td>
> </tr>
> </table>
> </body>
> I don't see any empty space under the table when I make the content
> cell large enough to make the page scroll.
> -Phil
Eek! Table tags! I have a css div/span only page that shows up identical in
firefox, ie, netscape, opera, blah blah You can email me direct for a more
readable version? userid=Michael.Baltic email server=NCMC.com

Heres the markup

<body ms_positioning="FlowLayout">
<form id="frmLogout" method="post" runat="server">
<div id="page">
<div id="pageBanner">
<a href="http://links.10026.com/?link=http://www.ag.state.oh.us" tabindex="-1"><img
src="../media/banner/ag_header.jpg" alt="Ohio Attorney General - Jim Petro">
</a>
</div> <!-- id pageBanner-->
<div id="pageBannerPrint">
<a href="http://links.10026.com/?link=http://www.ag.state.oh.us" tabindex="-1"><img
src="../media/banner/print_header.jpg" alt="Ohio Attorney General - Jim
Petro"></a>
</div>
<div id="pageSubBannerInline">
<div id="appIcon">
<a href="http://links.10026.com/?link=#" tabindex="-1"><img src="http://pics.10026.com/?src=../media/banner/AG_Rx.gif" alt="AGRx">
</a>
</div> <!--id appIcon-->
<div id="appMenu">
</div> <!--id appMenu-->
</div> <!--id pageSubBannerInline-->
<div id="pageHeader">
<h1>Logout</h1>
</div> <!-- id pageHeader -->
<div id="pageContentContainer">
<div id="pageDescription"> </div> <!-- id pageDescription -->
<div id="pageContentNoSidebar">
<div class="pageStatusLabel">
<asp:label id="lblStatus" runat="server"></asp:label>
</div> <!-- class pageStatusLabel -->
<div class="form">
<h1>You have successfully logged out</h1>
</div> <!-- class form -->
</div> <!-- id pageContentNoSidebar -->
</div> <!-- id pageContentContainer -->
<div id="pageFooter">
<span>The office of Attorney General of Ohio disclaims liability for any
errors or
omissions. Prescription drug prices may vary from day to day, so the
price that you find at your pharmacy may not be the same price that
appears in
this survey. Please contact your pharmacist to verify current pricing
before
visiting the pharmacy.</span>
</div> <!-- id pageFooter --></div> <!-- id page -->
</form>
</body
--
Staff Consultant II - Enterprise Web Services - Cardinal Solutions Group

Future Business Model - National City Mortgage

"Douglas Adams" wrote:

> Thanks Phil,
> I guess it's an issue with the way in which FireFox displays Form items.
> This method will work, although if anyone knows how to do the same with div,
> then I'd appreciate knowing.
> Thanks.
>
> "Phillip Ian" <phlian@.comcast.net> wrote in message
> news:1120222948.760104.230450@.f14g2000cwb.googlegr oups.com...
> > Are there form elements in your header and footer? If not, you could
> > just move the <form></form> stuff inside the main content cell. I
> > tried this:
> > <body>
> > <table cellspacing="0" cellpadding="0" border="1" width="100%">
> > <tr height="60">
> > <td>Header Goes Here</td>
> > </tr>
> > <tr>
> > <td>
> > <form id="Form1" method="post" runat="server">
> > Main Content<br>
> > </form>
> > </td>
> > </tr>
> > <tr height="60">
> > <td>Footer Goes Here</td>
> > </tr>
> > </table>
> > </body>
> > I don't see any empty space under the table when I make the content
> > cell large enough to make the page scroll.
> > -Phil
>
Thanks Michael, I've sent you an email, the email address i use for these
forums is doug4345345 at hotmail.co.uk
"Michael Baltic" <MichaelBaltic@.discussions.microsoft.com> wrote in message
news:CC827151-0101-4BCA-9626-B02BE2F73EA2@.microsoft.com...
> Eek! Table tags! I have a css div/span only page that shows up identical
> in
> firefox, ie, netscape, opera, blah blah You can email me direct for a
> more
> readable version? userid=Michael.Baltic email server=NCMC.com
> Heres the markup
> <body ms_positioning="FlowLayout">
> <form id="frmLogout" method="post" runat="server">
> <div id="page">
> <div id="pageBanner">
> <a href="http://links.10026.com/?link=http://www.ag.state.oh.us" tabindex="-1"><img
> src="http://pics.10026.com/?src=../media/banner/ag_header.jpg" alt="Ohio Attorney General - Jim
> Petro">
> </a>
> </div> <!-- id pageBanner-->
> <div id="pageBannerPrint">
> <a href="http://links.10026.com/?link=http://www.ag.state.oh.us" tabindex="-1"><img
> src="http://pics.10026.com/?src=../media/banner/print_header.jpg" alt="Ohio Attorney General - Jim
> Petro"></a>
> </div>
> <div id="pageSubBannerInline">
> <div id="appIcon">
> <a href="http://links.10026.com/?link=#" tabindex="-1"><img src="http://pics.10026.com/?src=../media/banner/AG_Rx.gif" alt="AGRx">
> </a>
> </div> <!--id appIcon-->
> <div id="appMenu">
> </div> <!--id appMenu-->
> </div> <!--id pageSubBannerInline-->
> <div id="pageHeader">
> <h1>Logout</h1>
> </div> <!-- id pageHeader -->
> <div id="pageContentContainer">
> <div id="pageDescription"> </div> <!-- id pageDescription -->
> <div id="pageContentNoSidebar">
> <div class="pageStatusLabel">
> <asp:label id="lblStatus" runat="server"></asp:label>
> </div> <!-- class pageStatusLabel -->
> <div class="form">
> <h1>You have successfully logged out</h1>
> </div> <!-- class form -->
> </div> <!-- id pageContentNoSidebar -->
> </div> <!-- id pageContentContainer -->
> <div id="pageFooter">
> <span>The office of Attorney General of Ohio disclaims liability for any
> errors or
> omissions. Prescription drug prices may vary from day to day, so the
> price that you find at your pharmacy may not be the same price that
> appears in
> this survey. Please contact your pharmacist to verify current pricing
> before
> visiting the pharmacy.</span>
> </div> <!-- id pageFooter --> </div> <!-- id page -->
> </form>
> </body>
> --
> Staff Consultant II - Enterprise Web Services - Cardinal Solutions Group
> Future Business Model - National City Mortgage
>
> "Douglas Adams" wrote:
>> Thanks Phil,
>>
>> I guess it's an issue with the way in which FireFox displays Form items.
>> This method will work, although if anyone knows how to do the same with
>> div,
>> then I'd appreciate knowing.
>>
>> Thanks.
>>
>>
>> "Phillip Ian" <phlian@.comcast.net> wrote in message
>> news:1120222948.760104.230450@.f14g2000cwb.googlegr oups.com...
>> > Are there form elements in your header and footer? If not, you could
>> > just move the <form></form> stuff inside the main content cell. I
>> > tried this:
>>> > <body>
>> > <table cellspacing="0" cellpadding="0" border="1" width="100%">
>> > <tr height="60">
>> > <td>Header Goes Here</td>
>> > </tr>
>> > <tr>
>> > <td>
>> > <form id="Form1" method="post" runat="server">
>> > Main Content<br>
>> > </form>
>> > </td>
>> > </tr>
>> > <tr height="60">
>> > <td>Footer Goes Here</td>
>> > </tr>
>> > </table>
>> > </body>
>>> > I don't see any empty space under the table when I make the content
>> > cell large enough to make the page scroll.
>>> > -Phil
>>>
>>
>

0 comments:

Post a Comment