• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 280
  • Last Modified:

Is it not possible to use asp:Panel inside of ContentPlaceHolder?

Hello all,

I am trying to use Panels (in order to show/hide certain areas based on user action) inside of a ContentPlaceHolder, and I am getting all sorts of wacky behavior. For whatever reason, the Panel keeps falling off the bottom of the Page (it's like the ContentPlaceHolder doesn't see the Panel and so doesn't size itself accordingly..). Has anyone else experienced this issue and does anyone know of a workaround?


Thanks a ton
0
OddiC
Asked:
OddiC
  • 3
  • 2
2 Solutions
 
samtran0331Commented:
Using a Panel inside a contentplaceholder should not pose any problems....could it be a CSS style that's causing it to "fall off the bottom"?
also...what does that mean? is the panel content not rendering at all? or is the placement wrong?
0
 
OddiCAuthor Commented:
The placement is wrong- the Panel appears halfway (or about 1/3) inside my asp:Content  area and about halfway on the bottom of the page (which is defined in template.master). I will post my markup below:

<%@ Page Language="C#" MasterPageFile="~/Template.master" AutoEventWireup="true"
    CodeFile="Contact.aspx.cs" Inherits="Contact" Title="Contact Us" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    &nbsp;<center>
        <asp:Panel ID="pnlForm" runat="server" Height="50px" Width="125px">
    <table align="center">
        <tr>
            <td style="width: 74px">
            </td>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
        </tr>
        <tr>
            <td style="width: 74px">
                Name:</td>
            <td style="width: 100px">
                <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
            </td>
            <td style="width: 100px">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtName"
                    ErrorMessage="*Required" Font-Italic="True"></asp:RequiredFieldValidator></td>
        </tr>
        <tr>
            <td style="width: 74px">
                Email:</td>
            <td style="width: 100px">
                <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox></td>
            <td style="width: 100px">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtEmail"
                    ErrorMessage="*Required" Font-Italic="True"></asp:RequiredFieldValidator></td>
        </tr>
        <tr>
            <td style="width: 74px">
            </td>
            <td style="width: 100px">
            </td>
            <td style="width: 100px">
            </td>
        </tr>
        <tr>
            <td style="width: 74px">
                Comments:</td>
            <td style="width: 100px" align="left">
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtComments"
                    ErrorMessage="*Required" Font-Italic="True"></asp:RequiredFieldValidator></td>
            <td style="width: 100px">
            </td>
        </tr>
        <tr>
            <td colspan="3">
                <asp:TextBox ID="txtComments" runat="server" Height="100px" TextMode="MultiLine"
                    Width="100%"></asp:TextBox></td>
        </tr>
        <tr>
            <td colspan="3" style="height: 40px; text-align: center">
                <asp:Button ID="btnSend" runat="server" Text="Send Mail" OnClick="btnSend_Click" /></td>
        </tr>
    </table>
        </asp:Panel>
    </center>
    <br />
    <asp:Panel ID="pnlThanks" runat="server" Height="50px" Width="125px" Visible="False">
        <asp:Label ID="lblThanks" runat="server" Font-Names="Arial" Text="Thank you for contacting us!"
            Visible="False" Width="500px"></asp:Label><br />
        <asp:Image ID="imgMailbox" runat="server" ImageUrl="~/images/mailbox.gif" Visible="False" />
    </asp:Panel>
    <br />
    <br />
</asp:Content>
0
 
samtran0331Commented:
>>halfway (or about 1/3) inside my asp:Content  area and about halfway on the bottom of the page (which is defined in template.master)

The only way I can see that happening is if you have something in template.master that is using a absolute positioning in the style or css and/or you're doing something with div z-order and layering and positioning....wanna post template.master?

also...clear your caches to see if it makes a difference...
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
DropZoneCommented:
For starters, you gave the panel a Width="125px", but your table within it defines 3 columns that add up to 274 pixels.  You also have a mix of deprecated html formatting tags and css styles (e.g. <center>, etc.), this may cause layout issues with some browsers.

I would suggest you attempt putting the panel inside the placeholder by itself and make sure it renders as you wish, and then little by little add elments to the panel to find out where it breaks down.

     -dZ.
0
 
OddiCAuthor Commented:
I see where I screwed up- I had a fixed H & W. You can have the points for your info though, thanks!
0
 
OddiCAuthor Commented:
Thank you drop zone. That's what i just determined. You can have some points as well..
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now