how to control Panel (and stuff inside panel)'s position?

admin

Administrator
Staff member
I've been having serious trouble to control html/web control's position inside Panel. Seems like the normal html code:
<tr><td align="center"><asp:Panel></asp:Panel></td></tr> doesn't work at all.

As for right now, I'm using style attribute to control Panel's position:

style="Z-INDEX: (num); LEFT: (num)px; POSITION: absolute; TOP: (num)px"


But this code is not cross browser functional. Position that looks nice on FF will look crappy in IE, or the other way around.

Any idea I can mix Panel with html tag, or any suggestion I can utilizing Panel while output won't mess up depended on browser?

TIAYou can never use asp.net controls like this "<asp:Panel></asp:Panel>"
you must add runat="server" attribute and if you intend to use that panel in Code you must give it id
<asp:Panel ID="Panel1" Runat="Server"></asp:Panel>Thanks for the reply Cipher, sorry for being sloopy about my syntax.
but the problem still there ---- How to control Panel's position ----

Can you help adjust my problem?
ThanksYou also can not use Style attribute in .NET control :) you should use CssClass
in Head tag:
<style>
.Panel {
Z-INDEX: (num);
LEFT: (num)px;
POSITION: absolute;
TOP: (num)px
}
</style>

Panel tag:
<asp:Panel ID="Panel1" Runat="Server" CssClass="Panel"></asp:Panel>

Good Luck<asp:panel id="pnlHinMenu" style="Z-INDEX: 122; LEFT: 0px; POSITION: absolute; TOP: 700px" runat="server" Width="16px">

try putting your html tags here

</asp:panel>

just an idea

i have used <div></div> as only html without the runat="server" or which not on the server side, and inside that <div></div> i place a panel with a runat="server" to create textbox on runtime, i have no problem with positioningi have no problem with positioning

Hi redfox, thanks for the response. I think maybe I wasn't being clear on my question, so I misleaded ciper going on tangent.

Your response seems to be on the right track, so I'm gonna try again :)

-The code you just showed me, try run it on FF and then IE, will they position differently?

-I have no problem positioning my panel (if just focus on 1 broswer), I just -can't- make'em position the way I wanted to be in cross broswers.

-when using asp.net control properties to make changes, I've noticed that only IE would recongize those changes, other browser such as Opera/FF won't response to asp.net control properties. (i.e. change border, FF won't recongize it)

Plz share some more thoughts on this.
Thanks for ur time :)thats why when developing a website, sometimes you don't rely on one browser, me when i design i use two browsers to see if both browser shows my designs the way i want it to be, what interface are you using to edit your codes, are you using visual studio.net or some other software application<asp:panel id="pnlHinmokuLookup" style="Z-INDEX: 181; LEFT: 0px; VISIBILITY: hidden; POSITION: absolute; TOP: 0px; Design_Time_Lock: True"
runat="server" BackColor="Transparent" Height="500px" Width="500px" Design_Time_Lock="True" CssClass="textcenter" HorizontalAlign="Center">

<DIV style="LEFT: 0px; WIDTH: 498px; BORDER-TOP-STYLE: outset; BORDER-RIGHT-STYLE: outset; BORDER-LEFT-STYLE: outset; POSITION: absolute; TOP: 0px; HEIGHT: 498px; BACKGROUND-COLOR: #a9a9a9; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: outset" ms_positioning="GridLayout">

<asp:Label id="lblENNAME" style="Z-INDEX: 100; LEFT: 0px; POSITION: absolute; TOP: 0px; Design_Time_Lock: True" CssClass="textFont14WhiteBold + padding5Top" Design_Time_Lock="True" Width="490px" Height="32px" BackColor="#3366FF" runat="server" BorderStyle="Solid" BorderWidth="1px" BorderColor="#3366FF">HINMOKU LOOKUP</asp:Label>
</DIV>
</asp:panel>

here is a sample, you see div is inside a panel, but you can do it the other way around, div first then panel, as you can see in my example the panel is from the server side which has the runat server and the div does not have any, as the div isa a basic html tag or shall i say client side, if positioning is your problem just adjust the left and top inside your tag and try viewing it not only in one browser, try viewing it in IE, FF, MOZARILLA , or better yet try using javascript, for positioning
 
Back
Top