VPF::как заставить элемент заполнять контейнер

hexzo

Дата 15.9.2012, 14:59 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 178
Регистрация: 30.1.2011

Репутация: нет
Всего: нет

Например у меня в верхнем контейнере находится контрол. А в нижнем контейнере его элементы управления, высота нижнего контейнера автоматическая.

Как сделать, что бы верхний контейнер занимал всё оставшееся ему от нижнего контейнера пространство? Как такая задача решается?

Код


<html style="height:100%;">
  <body style="position:relative">
    <div style="position:absolute;height:100%;width:50%">
     
       <div style="position:absolute;top:0;width:100%;background-color:lightgray;">
       вот как бы этот блок растянуть на всё отставшееся пространство?
       </div>

      <div style="position:absolute;bottom:0;background-color:gray;width:100%;" >
      <button>pararam</button> 
      </div>

    </div>
  </body>
</html>

mark2009

Дата 26.9.2012, 09:44 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 106
Регистрация: 12.10.2009

Репутация: нет
Всего: 1

При указанной разметке верхнего контрола в FF вообще практически не видно.
И как вы понимаете следующую фразу:

Код


верхний контейнер занимал всё оставшееся ему от нижнего контейнера пространство?

Может быть наоборот? чтобы верхний к примеру на 30% а нижний на 70?

hexzo

Дата 2.10.2012, 11:07 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 178
Регистрация: 30.1.2011

Репутация: нет
Всего: нет

Цитата

И как вы понимаете следующую фразу:

Да я хотел сделать по аналогии с вин формс. Там есть такое свойство System.Windows.Forms.Control = Fill.

mark2009

Дата 9.10.2012, 11:54 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 106
Регистрация: 12.10.2009

Репутация: нет
Всего: 1

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

bork

Дата 16.10.2012, 13:06 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 98
Регистрация: 4.1.2008

Репутация: нет
Всего: нет

При абсолютном позиционировании этого добиться нельзя (только с подключением скриптов для вычисления размеров экрана и передачи расчётов в стили блоков, но я бы этого делать не стал)
Нужна обычная вёрстка без position:absolute

ksnk

Дата 16.10.2012, 14:15 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

Абсолютное позиционирование там действительно нужно?
Вот такое не подойдет?

Код


<!doctype html>
<html style="height:100%;">
  <body style="position:relative;height:100%;">
    <div style="display:table;height:100%;">
<!--       <div style="display:table-row;height:20%;background-color:gray;">
       шапко-ушанко...
       </div> -->
       <div style="display:table-row;background-color:lightgray;">
       вот как бы этот блок растянуть на всё отставшееся пространство?
       </div>
      <div style="display:table-row;height:20%;background-color:gray;">
      <button>pararam</button> 
      </div>
    </div>
  </body>
</html>

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »