APS table usage

I have a user control developed a long time ago in asp.net 1.1 VS2003 and it has a table that displays detail info about a policy. Now I have upgraded the web app to .NET 4.0 and using HTML 4.01. The older version is running on the internet and when I come to the form that has this control on it, there is the possibility of having more than one value on one of the rows of data. When this happens there is a <asp:PlaceHolder to hold the additional value in the Insured First 5 Names and everything is supposed to shift down. If it only has one value then it only has one row and everything is ok. If it has more then one value it has as many rows as needed.  Im not sure where this is going wrong but I did upgrade this to HTML 4.01 so Im thinking something is going wrong there. If you look at the correct pic and then the incorrect pic maybe it will become more clear. I had to erase some of the info on the page but hopefully you can tell whats going on. There is 5 Insured Names and everything is supposed to shift down but its not in the new version. Any help would be appreciated

Thanks
JK
Correct.jpg
InCorrect.jpg
jknj72Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

jknj72Author Commented:
files are attached now...Sorry
0
jknj72Author Commented:
I have the code behind and the markup if anyone wants to see it as well
0
omgangIT ManagerCommented:
Is it the white background area that isn't growing?  Have you looked at the page in dev tools, e.g. Chrome Developer Tools (Ctrl + Shift + I) to see what styling is being applied and, perhaps, what is preventing the section from growing?

Post up the markup and any styling (CSS) you have that is relevant to the control.
OM Gang
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

jknj72Author Commented:
The white portion of the page should adjust to the additional rows that are being loaded. It should look like the correct.jpg that I attached. I have downloaded firefox and firebug to try and figure out the problem but I dont know how to use it. And....when I try to go to the page in production using firefox the same thing happens. It works fine in IE, in Prod) but in Firefox the same thing happens as if I was in Dev using IE. So Im thinking it is a browser issue(possibly a CSS issue). Any thoughts?
0
jknj72Author Commented:
Here are the markup for the form where the control resides and the control itself...I could really use some help on this so thank you for your time

JK
pcovIndivControl.ascx.txt
PcovIndiv.aspx.txt
0
jknj72Author Commented:
if you need any CSS let me know...
0
omgangIT ManagerCommented:
It looks like the div is you container and you have it set to a fixed height.  Test by removing the height setting, i.e.
<div style="width: 100%;position:relative">
OM Gang


<div style="width: 100%; height: 184px;position:relative">     <---- this DIV is the container/white background

    <table  id="Table1" style="width: 100%; height: 32px;" cellspacing="1" cellpadding="1"
        border="0">
        <tr>
            <td style="width: 248px; height: 55.49%; vertical-align: top; text-align: right;
                background-color: #b0c4de; text-wrap: none">                
                <asp:Label ID="lblDescripNameSelected" runat="server" Width="240px" CssClass="PcovIndivDescript">Name Selected:</asp:Label>
            </td>
            <td style="height: 35px; vertical-align: top; text-align: left;" valign="top" nowrap="nowrap"
                align="left" colspan="2">
                <asp:Label ID="lblNameSelected" runat="server" CssClass="PcovIndivLabels"></asp:Label>
            </td>
        </tr>

Open in new window

0
jknj72Author Commented:
still not working...I attached main.css for the form just in case it may have something to do with it...Thanks for your help

JK
Main.CSS.txt
0
omgangIT ManagerCommented:
I took the markup and created a simple html page with it.  I specifically set the Table Row for the control to have a larger height and separate background color and changed the body background to a different color to differentiate.  This renders correctly in Firefox and IE so I'm not sure what's causing the issue you are seeing.  Tough to determine without being able to load an actual page from the app.
OM Gang


This is my sample html page.  copy and paste into a notepad and same as SamplePage.html
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body style="background-color:azure">

    <table id="Table2" cellspacing="0" cellpadding="0" align="left"
           border="0" style="vertical-align: top; width: 900px; height: 600px">
        <tbody>
            <tr>
                <td width="3%" height="1"></td>
                <td width="8%" height="1"></td>
                <td width="86%" height="1"></td>
                <td width="3%" height="1"></td>
            </tr>
            <tr>
                <td width="3%">&nbsp;</td>
                <td valign="middle" align="left" width="8%" height="73" rowspan="3">
                    <!--***************************************Test Image*********************************-->
                    <a style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none;
                            BORDER-BOTTOM-STYLE: none"
                       href="http://www.njcrib.com">
                        <!--<IMG height="113" src="nj3.gif" width="65" border="0"> -->
                        <!--<IMG height="113" src="./images/nj3.gif" width="65" border="0">-->
                        <!--<asp:Image ID="Image1" runat="server" Height="113px" Width="65px" BorderStyle="None" ImageUrl="./images/nj3.gif" />-->
                    </a>

                </td>
                <td valign="middle" align="left" width="89%" colspan="2" height="73">
                    <!--***************************************Test Image*********************************-->
                    <a style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none;
                            BORDER-BOTTOM-STYLE: none"
                       href="http://www.njcrib.com">
                        <!--<IMG height="50" src="logo.gif" width="180" border="0">-->
                        <!--<IMG height="50" src="./images/logo.gif" width="180" border="0">-->
                        <!--<asp:Image ID="Image2" runat="server" Height="50px" Width="180px" BorderStyle="None" ImageUrl="./images/logo.gif" />-->
                    </a>

                </td>
            </tr>
            <tr>
                <td width="100%" colspan="4" height="10"></td>
            </tr>
            <tr>
                <td width="100%" colspan="4" height="10"></td>
            </tr>
            <tr>
                <td colspan="4">
                    <table width="100%" border="0" cellspacing="0" cellpadding="0" id="Table3">
                        <tr align="left">
                            <td width="1%">
                                <!--<IMG height="24" src="./images/testl.gif">-->
                                <!--<asp:Image ID="Image3" runat="server" Height="24px" ImageUrl="./images/testl.gif" />-->
                            </td>
                            <td width="5%" bgcolor="#ffffff"></td>
                            <td width="88%" bgcolor="#ffffff">&nbsp;</td>
                            <td width="5%" bgcolor="#ffffff"></td>
                            <td align="right" width="1%">
                                <!--<IMG src="./images/testr.gif">-->
                                <!--<asp:Image ID="Image4" runat="server" ImageUrl="./images/testr.gif" />-->
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td valign="top" align="center" width="100%" colspan="4">
                    <table cellspacing="0" cellpadding="0" width="100%" align="center" bgcolor="#ffffff"
                           border="0" style="vertical-align: top;position:relative;">
                        <tr valign="top">
                            <td width="3%" style="height: 90px">&nbsp;</td>
                            <td align="center" width="94%" colspan="1" style="HEIGHT: 90px">
                                <span class="Where">
                                    <br>
                                    <br>
                                    POLICY COVERAGE SEARCH<br>
                                    <hr width="90%" noshade="noshade" size="3">
                                </span>
                                <br>
                            </td>
                            <td width="3%" style="HEIGHT: 90px">&nbsp;</td>
                        </tr>
                        <tr valign="top">
                            <td width="3%">&nbsp;</td>
                            <td align="center" width="94%">
                                <table id="divTable" width="100%" border="0">
                                    <tr>
                                        <td width="10%">&nbsp;</td>
                                        <td width="80%" align="center">
                                            <!--<uc1:FileUploadDate ID="Fileuploaddate1" runat="server"></uc1:FileUploadDate>-->
                                            This is the File Upload date
                                        </td>
                                        <td width="10%">&nbsp;</td>
                                    </tr>
                                </table>
                            </td>
                            <td width="3%">&nbsp;</td>
                        </tr>
                        <tr style="height:800px;background-color:crimson">
                            <td width="3%"></td>
                            <td align="center" width="94%">
                                This is the Control<br />
                                Here is some content<br />
                            </td>
                            <td width="3%"></td>
                        </tr>
                        <tr>
                            <td width="3%" style="HEIGHT: 67px"></td>
                            <td width="94%" style="HEIGHT: 67px">
                                <hr style="WIDTH: 100%; HEIGHT: 4px" width="100%" noshade="noshade" size="4">
                                <asp:Button ID="butBack" runat="server" BackColor="LightSteelBlue" Text="Back" Width="104px"
                                            Height="24px"></asp:Button>
                            </td>
                            <td width="3%" style="HEIGHT: 67px"></td>
                        </tr>
                        <tr>
                            <td align="center" width="100%" colspan="3">
                                <hr>
                                <a href="http://www.njcrib.com" style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none;
                                        BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none">Home</a>
                                <hr>
                            </td>
                        </tr>
                        <tr>
                            <td width="3%"></td>
                            <td align="center" width="94%">
                                <font face="Arial" size="1">
                                    <br>
                                    <br>
                                    <br>
                                    Copyright © 1997 - 2008 by NJCRIB<br>
                                    All Rights Reserved
                                    <br>
                                    <br>
                                </font>
                            </td>
                            <td width="3%"></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>


</body>
</html>

Open in new window

0
jknj72Author Commented:
ok I will give it a shot...what version did you use? I am working in VS 2012 .NET 4. This is a conversion from ASP.NET 2003 .NET 1.1(which is where I am assuming the issues are coming from). I actually tried to add the meta tag you had
<meta charset="utf-8" />
and I get the following...Dont know if its a show stopper but..

Warning      35      Validation (HTML 4.01): Attribute 'charset' is not a valid attribute of element 'meta'.      

Any thoughts?
0
omgangIT ManagerCommented:
I created the html page in VS 2013.  The <meta charset="utf-8" /> needs to be at the top of the doc.  Before any script, etc. tags.  That should resolve the warning you are receiving.
OM Gang
0
omgangIT ManagerCommented:
Please try:

View the page in Chrome
Key in Ctrl + Shift + I to enable Developer Tools
In the left hand pane, drill down to the html element you want to analyze (the TR where your user control is embedded).
View the styling that is being applied; note that you can change/experiment with modifying both the styling and/or the html markup.  See screen shot below of the sample page I created.
OM Gang

Chrome Dev Tools
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
jknj72Author Commented:
That worked but I still have a few things not working but on other parts of the app....Thanks for your help
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.