Как стилизовать вложенные элементы управления панели в ASP.NET

StackOverflow https://stackoverflow.com/questions/903002

  •  05-09-2019
  •  | 
  •  

Вопрос

У меня есть панель, расположенная в div, и я хочу использовать эту панель в качестве контейнера для добавления других панелей!Зачем мне добавлять панель к панели?Потому что панель, которую я добавляю к существующей панели, также создана для того, чтобы содержать объекты, но только изображение и метку.

Существующая панель master container создается во время разработки и носит красивое название "toolboxpanel".Во время выполнения у меня есть цикл for / next, который динамически создает изображение, метку, добавляет их оба на панель, затем добавляет эту панель в toolboxpanel, как можно видеть здесь:

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

Проблема в том, что каждая панель, которую я добавляю на панель, заполняется в 1 столбец и полностью нарушает правила css toolboxpanel, которые говорят, что максимальная высота составляет всего 700 пикселей.Кажется, что панель и div, в котором она находится, растягиваются намного выше, чем предполагалось!

Мои главные вопросы таковы:

1) Как мне сделать так, чтобы я мог добавлять объекты панели (с моим изображением / ярлыком) на главную панель таким образом, чтобы она отображалась с 3 столбцами, фиксированной видимой высотой и аккуратной полосой прокрутки?

2) Есть ли лучший способ сделать это?Там должно быть :(

Вы можете увидеть текущий беспорядок на главной странице: http://www.mobiuspc.com

Я ценю любую помощь!Билл

Это было полезно?

Решение

Вам нужны две вещи:

  1. A таблица стилей clearfix
  2. Для перемещения ваших внутренних панелей

Плавать просто, но иногда поначалу это может немного пугать. Прочтите эти учебные пособия на поплавках, чтобы узнать о них все.

По сути, все, что вам нужно сделать, это добавить следующий стиль к стилям ваших внутренних панелей:

float: left;

Плавающий автоматически сделает div и все его содержимое как можно более узкими, поэтому обязательно укажите ширину, как вы уже сделали.

Далее вам нужно будет применить стиль clearfix к вашей внешней панели, чтобы все плавающее содержимое внутри нее не страдало от "эффекта гильотины".Поскольку плавающие блоки не имеют "layout", они не являются частью обычного потока документов и, следовательно, игнорируются их родительскими контейнерами.clearfix решает эту проблему, заставляя контейнер распознавать значения с плавающей точкой как имеющие макет.

Другие советы

Панели обычно, но не всегда, должны отображаться в виде тегов div, идентификаторы обрабатываются контейнером именования, поэтому проще добавить атрибут cssclass..соответствующим образом настройте свой css.

Если вы хотите, чтобы overfow позволял прокручивать, вам нужно, чтобы ваше позиционирование и высота были установлены таким образом, чтобы это позволяло.

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

должен это сделать.:)

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top