Wie verschachtelt Bedienelemente in ASP.NET, um Stil

Question

Ich habe eine Platte in einem div sitzen, und ich möchte, dass die Platte als Behälter verwenden, um mehr Platten hinzuzufügen! Warum sollte ich ein Panel zu einem Panel hinzufügen? Da die Platte, die ich an die bestehende Platte bin hinzugefügt wird, wird auch Objekte enthalten gemacht, aber nur und Bild und beschriften.

Die vorhandenen Master-Container-Panel wird während der Entwurfszeit erstellt und trägt den schönen Namen „toolboxpanel“. Während der Laufzeit habe ich eine für / nächste Schleife, die dynamisch ein Bild erzeugt, ein Etikett, fügt sie beide an eine Platte, fügt dann hinzu, dass die Platte auf die toolboxpanel, wie hier zu sehen:

For i = 0 To imageholder.Count - 1 'create a control
        insertpanel = New Panel 'these object types have been DIM'd up above
        insertimage = New Image
        inserttext = New Label
        inserttext.ID = "text" + partnumberholder(i) + i.ToString 'the "holder" arrays hold the goodies from my db
        inserttext.Text = brandholder(i) + " " + partnumberholder(i)
        insertimage.ID = "image" + partnumberholder(i) + i.ToString
        insertimage.ImageUrl = ".\Images\Display\" + imageholder(i) + ".jpg"
        insertpanel.CssClass = "drag" 'this allows the panel to be dragged around using a JQuery script elsewhere
        'insertpanel.BackImageUrl = "~\Images\Display\" + imageholder(i) + ".jpg" 'commented out because this method looks awful
        insertpanel.ID = "panel" + partnumberholder(i) + i.ToString

        insertpanel.Controls.Add(insertimage)
        insertpanel.Controls.Add(inserttext)
        toolboxpanel.Controls.Add(insertpanel)
    Next

Das Problem ist, dass jede Platte I auf das Panel hinzufügen wird in 1 Spalte gestopft und völlig gegen die CSS-Regeln des toolboxpanel, die maximale Höhe sagen ist nur 700px. Es scheint, die Platte zu strecken, und die div seiner Sitzung in, auf Art und Weise höher als sein sollte sein!

Meine Hauptfragen sind:

1) Wie kann ich es so kann ich Panel-Objekte (mit meinem Bild / label Eingeweide) an der Hauptplatte in einer Art und Weise hinzuzufügen, wo es mit 3 Spalten, feste sichtbare Höhe und ordentlich Bildlaufleiste angezeigt wird?

2) Gibt es einen besseren Weg, dies zu tun? Es muss sein: (

Sie können den aktuellen Schlamassel auf der Homepage sehen: http://www.mobiuspc.com

Ich schätze jede Hilfe! Bill

Answer 1

Sie müssen zwei Dinge:

1. clearfix Sheet
2. schweben Ihre inneren Platten

Schwimmdock ist einfach, aber kann manchmal ein bisschen einschüchternd auf den ersten sein. diese Tutorials lesen auf Schwimmern über sie alle zu lernen.

Im Grunde alles, was Sie tun müssen, ist die folgende Art Ihres inneren Panels' Stile hinzufügen:

float: left;

Schwimm automatisch die div machen, und alle Inhalte, so schmal wie möglich, so sicher sein, geben Sie eine Breite , wie Sie bereits haben.

Als nächstes müssen Sie den clearfix Stil zu Ihrer äußeren Platte aufzubringen, so dass alle Floating-Inhalte im Innern nicht von dem „Guillotine-Effekt“ leiden. Da schwebenden Blöcke haben keine „Layout“, sie sind Teil des normalen Dokumentenfluss nicht, und daher werden von ihren übergeordneten Container ignoriert. Die clearfix löst dies durch den Behälter zwingt Schwimmer zu erkennen, wie das Layout hat.

Answer 2

Panels sollten in der Regel, aber nicht immer, machen als div-Tags, erhalten die IDs von den Namenscontainer borked, so einfacher, ein CssClass Attribut .. das Set CSS entsprechend hinzuzufügen.

Wenn Sie overfow wollen Scrollen ermöglichen, werden Sie Ihre Positionierung möchten, und Höhe eingestellt dafür ermöglichen.

.myContainter {
    position: relative; /* or absolute, or a float */
    height: 700px;
    overflow: auto;
}

sollte es tun. :)