Блок div в высоту контейнера

@thegrif · Регистрация: 17.11.2017

Студворк — интернет-сервис помощи студентам

Здравствуйте. Ломаю голову. Как сделать что бы блок менюшки, растягивался при скроллинге в высоту блока с контентом.

Например как тут: http://3wf.ru/ (серая менюка слева) (не реклама!!!)

Применяю height: 100%; - но блок растягивается только в высоту экрана. Нужно что бы блок был min-height: 100%; (во всю высоту экрана, и растягивался при скролле, если в блоке с контентом много информации)

Пожалуйста, помогите если не сложно

@thegrif · 17.11.2017, 10:52 **[ТС]**

Вот что выходит

@shvyrevvg · 17.11.2017, 11:02

thegrif, а в чем сложность посмотреть css?

CSS
1
2
3
position: absolute;
top: 0;
bottom: 0;

@thegrif · 17.11.2017, 11:11 **[ТС]**

Для большего понимания:

Блок 1 - Меню | Блок 2 - Контент

Если у блока 2 высота 1500px то Блок 1 тоже растягивался по высоте Блока 2.

Добавлено через 7 минут
Ничего не происходит. Пробовал.

@shvyrevvg · 17.11.2017, 11:13

Для большего понимания:
нужно почитать про позиционирование.

Сообщение от thegrif

Ничего не происходит. Пробовал.

Где код?

@thegrif · 17.11.2017, 11:16 **[ТС]**

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<div class ="container-fluid">
 
 <div style="height: 100%;" class ="row">
 
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12 header">
 
<div class="search">
<form class="xx">
<input placeholder="ВВЕДИТЕ ЗАПРОС ДЛЯ ПОИСКА" class="search2" type="text">
</form>
</div>
 
<div class="menu">
 
<div class="dmenu"><div class="vmenu">КАТЕГОРИИ</div> <div style="position: absolute; right: 15px; top: 5px; font-size: 13px;" class="glyphicon glyphicon-tasks"></div></div>
 
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Авто</a></div>
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Государства</a></div>
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Магазины</a></div>
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Красота и здоровье</a></div>
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Культура и образование</a></div>
<div class="menulink"><a href=""><span class="glyphicon glyphicon-record ico"></span> Разное</a></div>
 
</div>
 
 </div>
 <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12 logotype">
 INFONER
 </div>
 
 <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12 index">
 
Большой текст
 
 </div>
 
</div>
</div>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
@font-face {
font-family: "Infoner";  
src: url("/fonts/infoner.ttf") format("truetype"); 
 }
 
@font-face {
font-family: "txt";  
src: url("/fonts/infoner_txt.otf"); 
 }
 
@font-face {
font-family: "menu";  
src: url("/fonts/menu.ttf"); 
 }
 
html {
     height:100%;
     }
 
body {
    height: 100%;
    font-family: tahoma;
    font-size: 10pt;
    color: #171413;
    background: #000;
    }
    
html, body { 
    margin:0;
    padding:0;
    }
    
.container-fluid {
    background: #fff;
    height: 100%;
}
    
.header {
    background: #32373c;
    color: white;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    top: 0;
    bottom: 0;
}
 
.logotype {
    background: #fff;
    height: 60px;
    font-family: Infoner;
    text-align: center;
    font-size: 41px;
    color: #32373c;
}
 
.index {
    background: #d9d9d9;
    font-family: menu;
    text-align: center;
    font-size: 18px;
    color: #32373c;
}
 
.search {
    width: 100%;
    height: 60px;
}
 
.search2 {
    width: 100%;
    height: 40px;
    border: 1px solid #5c6063;
    background: #32373c;
    font-family: txt;
    font-size: 22px;
    outline: none;
    text-align: center;
}
 
.search2:focus {
    border: 1px solid #fff;
}
 
.xx {
    padding: 10px;
}
 
.menu {
    padding-left: 10px;
    padding-right: 10px;
}
 
.dmenu {
    font-family: txt;
    font-size: 17px;
    border-bottom: 1px solid #5c6063;
    padding-left: 15px;
    position: relative;
}
 
.vmenu {
    display: inline-block;
    border-bottom: 4px solid #5c6063;
    padding-bottom: 5px;
}
 
.ico {
    margin-right: 3px; 
    color: #555c63;
    font-size: 13px;
}
 
.menulink {
    margin-left: 15px;
    margin-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #5c6063;
    font-family: menu;
}
 
.menulink:hover {
    color: #fff;
}
 
.menulink a {
    text-decoration: none;
    color: #c5cbd0;
}
 
.menulink a:hover {
    text-decoration: none;
    color: #fff;
}
 
a { 
    text-decoration: none;
    color: #c5cbd0;
}
 
a:hover { 
    text-decoration: none;
    color: #fff;
}

Добавлено через 2 минуты
скинул код

Qwerty_Wasd · 17.11.2017, 11:18

thegrif, к примеру - песочница

HTML5
1
2
3
4
5
6
7
8
9
10
11
<div class="wrap">
  <div class="menu"> 
    <ul>
      <li>bla-bla</li>
      <li>bla-bla</li>
      <li>bla-bla</li>
      <li>bla-bla</li>
    </ul>
  </div>
  <div class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut tempor lacus. Donec aliquet, lacus quis vulputate egestas, purus eros efficitur mauris, in maximus ipsum orci eget nulla. Aenean convallis ornare dui, eu volutpat erat pretium et. Duis nec sem vestibulum, blandit felis ac, finibus turpis. Ut arcu velit, lacinia nec pharetra eget, lacinia ut tellus. Duis id pharetra ligula. Proin sed tincidunt felis, ut tincidunt erat. Quisque feugiat purus quis lacus venenatis sodales. In hac habitasse platea dictumst. Sed consequat interdum ligula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed eget convallis dui, eu mattis leo. Integer venenatis, enim a mattis luctus, massa odio blandit metus, et hendrerit nunc leo ac arcu.Donec tristique felis magna, id aliquet dui posuere sed. Fusce sit amet vestibulum arcu. Sed faucibus, dolor vitae dignissim dignissim, urna ante pharetra lacus, posuere tincidunt quam risus eget felis. Integer vel facilisis tellus. Nam vitae sapien elit. Phasellus ipsum justo, laoreet nec purus at, elementum tempor felis. Praesent vitae arcu iaculis, luctus arcu id, rhoncus ante. Nunc sit amet urna molestie, lobortis est vehicula, malesuada urna. Nam nec nulla eu elit pulvinar ultricies eu sit amet augue. Aliquam ornare massa consectetur eros volutpat finibus sit amet vitae magna. Curabitur diam urna, luctus non neque ac, mollis fringilla nisi. Duis pellentesque eget nibh id blandit. Morbi et tincidunt quam. Sed ut cursus nulla.Donec ac quam consequat orci interdum blandit et vitae elit. Sed lacus lorem, semper ut posuere sit amet, tincidunt at ipsum. Sed gravida placerat leo. Quisque non euismod metus. Duis consequat egestas dapibus. Nunc bibendum, lectus quis venenatis feugiat, nulla justo efficitur lacus, vitae mattis odio turpis nec sem. In malesuada diam tortor, vitae porta tellus consequat elementum. Nunc fermentum mauris nunc. Aliquam euismod justo ipsum, a sollicitudin arcu sollicitudin a. Sed sodales eu ligula vel maximus. Integer sed odio sed est posuere aliquet vitae quis risus. Donec elementum, velit id pretium tincidunt, nisi diam tincidunt felis, quis accumsan tortor felis posuere augue. Praesent feugiat pharetra velit, et lacinia tellus.Fusce eget ornare turpis. Cras sit amet risus quis nulla convallis eleifend condimentum vitae dui. In consequat viverra pretium. Etiam vel vehicula nisl. Donec sit amet scelerisque nisi, ultrices volutpat leo. Aenean sit amet nunc quis massa iaculis gravida. Mauris eleifend, velit sed cursus tristique, nisl nisl placerat lorem, a consequat quam risus in sapien. Donec commodo magna tristique ex aliquam laoreet. Sed posuere rhoncus nibh, id pulvinar purus. Nunc egestas nibh ipsum, ultricies euismod eros sodales eget. Sed ac semper justo, vel suscipit elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque dapibus lectus urna, ut iaculis diam efficitur et.Ut maximus fermentum tortor eu suscipit. Phasellus eu justo at lectus placerat sodales in quis nisl. Morbi semper tortor a massa pulvinar, sed tincidunt lectus vulputate. Cras varius eu tellus vitae mollis. Nunc porta at tortor et dignissim. Phasellus molestie quis risus non consectetur. Aliquam scelerisque elit enim, vitae pellentesque leo luctus eget. Suspendisse sodales suscipit vestibulum. Pellentesque at molestie urna, vitae aliquet urna. Sed dictum dolor ac mollis vulputate.Proin ullamcorper augue ut egestas malesuada. Nullam ex libero, dignissim eu urna nec, imperdiet finibus leo. Nunc tempor porttitor elit, vel hendrerit elit tristique accumsan. In laoreet velit justo, condimentum posuere sapien pulvinar nec. Donec auctor massa eget velit rhoncus feugiat. Suspendisse felis erat, porta ut urna vel, egestas bibendum nulla. Nulla cursus dolor vehicula, imperdiet dolor et, varius turpis. Nulla consequat imperdiet orci nec luctus.Ut tempus diam massa, nec tempor arcu rutrum ut. Nam quis iaculis augue. Suspendisse rutrum metus sed lacus mollis, ac mollis est lobortis. Nulla eleifend, purus fermentum eleifend cursus, dui mauris scelerisque ex, sit amet ullamcorper leo erat id enim. Nunc posuere nec ante sed placerat. Ut in sapien metus. Morbi commodo accumsan urna, ut porta mi faucibus eu.Praesent luctus vel erat in ultrices. Mauris tristique arcu ut molestie vestibulum. Praesent eleifend nisl consequat velit commodo ullamcorper. Morbi auctor sagittis nunc sed tempus. Pellentesque finibus risus sed porta dictum. Mauris pulvinar nec ipsum sit amet euismod. Quisque sed vestibulum leo. Sed semper quis dolor ac aliquet. Maecenas lobortis tortor vitae faucibus sodales. In vitae facilisis nulla, nec elementum magna. Sed volutpat diam ut viverra elementum. In placerat dapibus molestie. Phasellus rhoncus placerat felis interdum porta. Morbi aliquam sagittis justo ut aliquam. Vestibulum a orci pharetra, accumsan arcu vel, volutpat nisl.Donec placerat libero a faucibus accumsan. Ut hendrerit enim sed feugiat fringilla. Donec euismod ultricies varius. Ut enim turpis, egestas ac iaculis at, pretium laoreet sem. Morbi sed consectetur nulla. Donec lacinia tortor eu blandit egestas. In scelerisque maximus neque quis gravida. Phasellus id viverra elit. Maecenas luctus purus ligula, in sodales lectus tempus sed. Phasellus orci diam, tincidunt quis urna et, ultrices cursus ipsum. Ut eget bibendum lectus. Sed ullamcorper, orci eu fermentum hendrerit, elit velit dictum urna, sed tempor nulla lectus quis urna. Praesent quis nulla interdum, faucibus eros quis, cursus magna. Donec venenatis tortor justo, non sollicitudin dui finibus vitae.Quisque convallis ipsum ligula, quis iaculis nisi semper eu. Ut lobortis porta erat, id cursus elit rutrum vel. Aliquam felis lectus, porta at condimentum vitae, aliquam in lectus. In ut massa eget elit malesuada vestibulum. Duis in ante id neque sagittis lacinia ac nec purus. Etiam eleifend metus arcu, a tempus ex dignissim id. In laoreet enim sed velit auctor, ut tristique nulla luctus. Maecenas sodales nunc nec tellus venenatis, id posuere purus dictum. Ut tellus sapien, scelerisque ut rutrum et, facilisis eget neque.</div>
</div>

CSS
1
2
3
.wrap{display:table;}
.menu{display:table-cell;width:100px;background:yellowgreen;}
.content{display:table-cell;}

@thegrif · 17.11.2017, 11:29 **[ТС]**

странно, пример очень хорошо работает, но когда в свой код интегрирую, ноль эффекта(((

Qwerty_Wasd · 17.11.2017, 13:25

thegrif, ну раз вы используете bootstrap - используйте flex. К примеру - песочница

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div class="conteiner-fluid">
  <div class="row-fluid wrap">
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 menu">
      <div class="search">
        <form class="xx">
          <input class="search2" placeholder="ВВЕДИТЕ ЗАПРОС ДЛЯ ПОИСКА" type="text"/>
        </form>
      </div>
      <div class="menu">
        <div class="dmenu">
          <div class="vmenu">КАТЕГОРИИ</div>
          <div class="glyphicon glyphicon-tasks" style="position: absolute; right: 15px; top: 5px; font-size: 13px"></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Авто</span></a></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Государства</span></a></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Магазины</span></a></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Красота и здоровье</span></a></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Культура и образование</span></a></div>
          <div class="menulink"><a href="#"><span class="glyphicon glyphicon-record ico"> Разное</span></a></div>
        </div>
      </div>
    </div>
    <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut tempor lacus. Donec aliquet, lacus quis vulputate egestas, purus eros efficitur mauris, in maximus ipsum orci eget nulla. Aenean convallis ornare dui, eu volutpat erat pretium et. Duis nec sem vestibulum, blandit felis ac, finibus turpis. Ut arcu velit, lacinia nec pharetra eget, lacinia ut tellus. Duis id pharetra ligula. Proin sed tincidunt felis, ut tincidunt erat. Quisque feugiat purus quis lacus venenatis sodales. In hac habitasse platea dictumst. Sed consequat interdum ligula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed eget convallis dui, eu mattis leo. Integer venenatis, enim a mattis luctus, massa odio blandit metus, et hendrerit nunc leo ac arcu.Donec tristique felis magna, id aliquet dui posuere sed. Fusce sit amet vestibulum arcu. Sed faucibus, dolor vitae dignissim dignissim, urna ante pharetra lacus, posuere tincidunt quam risus eget felis. Integer vel facilisis tellus. Nam vitae sapien elit. Phasellus ipsum justo, laoreet nec purus at, elementum tempor felis. Praesent vitae arcu iaculis, luctus arcu id, rhoncus ante. Nunc sit amet urna molestie, lobortis est vehicula, malesuada urna. Nam nec nulla eu elit pulvinar ultricies eu sit amet augue. Aliquam ornare massa consectetur eros volutpat finibus sit amet vitae magna. Curabitur diam urna, luctus non neque ac, mollis fringilla nisi. Duis pellentesque eget nibh id blandit. Morbi et tincidunt quam. Sed ut cursus nulla.Donec ac quam consequat orci interdum blandit et vitae elit. Sed lacus lorem, semper ut posuere sit amet, tincidunt at ipsum. Sed gravida placerat leo. Quisque non euismod metus. Duis consequat egestas dapibus. Nunc bibendum, lectus quis venenatis feugiat, nulla justo efficitur lacus, vitae mattis odio turpis nec sem. In malesuada diam tortor, vitae porta tellus consequat elementum. Nunc fermentum mauris nunc. Aliquam euismod justo ipsum, a sollicitudin arcu sollicitudin a. Sed sodales eu ligula vel maximus. Integer sed odio sed est posuere aliquet vitae quis risus. Donec elementum, velit id pretium tincidunt, nisi diam tincidunt felis, quis accumsan tortor felis posuere augue. Praesent feugiat pharetra velit, et lacinia tellus.Fusce eget ornare turpis. Cras sit amet risus quis nulla convallis eleifend condimentum vitae dui. In consequat viverra pretium. Etiam vel vehicula nisl. Donec sit amet scelerisque nisi, ultrices volutpat leo. Aenean sit amet nunc quis massa iaculis gravida. Mauris eleifend, velit sed cursus tristique, nisl nisl placerat lorem, a consequat quam risus in sapien. Donec commodo magna tristique ex aliquam laoreet. Sed posuere rhoncus nibh, id pulvinar purus. Nunc egestas nibh ipsum, ultricies euismod eros sodales eget. Sed ac semper justo, vel suscipit elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque dapibus lectus urna, ut iaculis diam efficitur et.Ut maximus fermentum tortor eu suscipit. Phasellus eu justo at lectus placerat sodales in quis nisl. Morbi semper tortor a massa pulvinar, sed tincidunt lectus vulputate. Cras varius eu tellus vitae mollis. Nunc porta at tortor et dignissim. Phasellus molestie quis risus non consectetur. Aliquam scelerisque elit enim, vitae pellentesque leo luctus eget. Suspendisse sodales suscipit vestibulum. Pellentesque at molestie urna, vitae aliquet urna. Sed dictum dolor ac mollis vulputate.Proin ullamcorper augue ut egestas malesuada. Nullam ex libero, dignissim eu urna nec, imperdiet finibus leo. Nunc tempor porttitor elit, vel hendrerit elit tristique accumsan. In laoreet velit justo, condimentum posuere sapien pulvinar nec. Donec auctor massa eget velit rhoncus feugiat. Suspendisse felis erat, porta ut urna vel, egestas bibendum nulla. Nulla cursus dolor vehicula, imperdiet dolor et, varius turpis. Nulla consequat imperdiet orci nec luctus.Ut tempus diam massa, nec tempor arcu rutrum ut. Nam quis iaculis augue. Suspendisse rutrum metus sed lacus mollis, ac mollis est lobortis. Nulla eleifend, purus fermentum eleifend cursus, dui mauris scelerisque ex, sit amet ullamcorper leo erat id enim. Nunc posuere nec ante sed placerat. Ut in sapien metus. Morbi commodo accumsan urna, ut porta mi faucibus eu.Praesent luctus vel erat in ultrices. Mauris tristique arcu ut molestie vestibulum. Praesent eleifend nisl consequat velit commodo ullamcorper. Morbi auctor sagittis nunc sed tempus. Pellentesque finibus risus sed porta dictum. Mauris pulvinar nec ipsum sit amet euismod. Quisque sed vestibulum leo. Sed semper quis dolor ac aliquet. Maecenas lobortis tortor vitae faucibus sodales. In vitae facilisis nulla, nec elementum magna. Sed volutpat diam ut viverra elementum. In placerat dapibus molestie. Phasellus rhoncus placerat felis interdum porta. Morbi aliquam sagittis justo ut aliquam. Vestibulum a orci pharetra, accumsan arcu vel, volutpat nisl.Donec placerat libero a faucibus accumsan. Ut hendrerit enim sed feugiat fringilla. Donec euismod ultricies varius. Ut enim turpis, egestas ac iaculis at, pretium laoreet sem. Morbi sed consectetur nulla. Donec lacinia tortor eu blandit egestas. In scelerisque maximus neque quis gravida. Phasellus id viverra elit. Maecenas luctus purus ligula, in sodales lectus tempus sed. Phasellus orci diam, tincidunt quis urna et, ultrices cursus ipsum. Ut eget bibendum lectus. Sed ullamcorper, orci eu fermentum hendrerit, elit velit dictum urna, sed tempor nulla lectus quis urna. Praesent quis nulla interdum, faucibus eros quis, cursus magna. Donec venenatis tortor justo, non sollicitudin dui finibus vitae.Quisque convallis ipsum ligula, quis iaculis nisi semper eu. Ut lobortis porta erat, id cursus elit rutrum vel. Aliquam felis lectus, porta at condimentum vitae, aliquam in lectus. In ut massa eget elit malesuada vestibulum. Duis in ante id neque sagittis lacinia ac nec purus. Etiam eleifend metus arcu, a tempus ex dignissim id. In laoreet enim sed velit auctor, ut tristique nulla luctus. Maecenas sodales nunc nec tellus venenatis, id posuere purus dictum. Ut tellus sapien, scelerisque ut rutrum et, facilisis eget neque.</div>
  </div>
</div>

CSS
1
2
3
.wrap{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-flex-flow: row wrap;flex-flow: row wrap;}
.menu{background:#00BCD4;}
.content{background:#C2185B;}

@thegrif · 17.11.2017, 14:00 **[ТС]**

спасибо большое, вот это сработало!

Новые блоги и статьи Все статьи Все блоги /
Жизнь в неопределённости kumehtar 23.03.2026 Жизнь — это постоянное существование в неопределённости. Например, даже если у тебя есть список дел, невозможно дойти до точки, где всё окончательно завершено и больше ничего не осталось. В принципе,. . .	Модель здравоСохранения: работники работают быстрее после её введения. anaschu 23.03.2026 geJalZw1fLo Корпорация до введения программа здравоохранения имела много невыполненных работниками заданий, после введения программы количество заданий выросло. Но на выплатах по больничным это. . .	1С: Контроль уникальности заводского номера Maks 23.03.2026 Алгоритм контроля уникальности заводского (или серийного) номера на примере документа выдачи шин для спецтехники с табличной частью. Данные берутся из регистра сведений, по которому настроено. . .	Хочу заставить корпорации вкладываться в здоровье сотрудников: делаю мат модель здравосохранения anaschu 22.03.2026 e7EYtONaj8Y Z4Tv2zpXVVo https:/ / github. com/ shumilovas/ med2. git
1С: Программный отбор элементов справочника по группе Maks 22.03.2026 Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию группы. . .	Как я обхитрил таблицу Word Alexander-7 21.03.2026 Когда мигает курсор у внешнего края таблицы, и нам надо перейти на новую строку, а при нажатии Enter создается новый ряд таблицы с ячейками, то мы вместо нервных нажатий Энтеров мы пишем любые буквы. . .	Krabik - рыболовный бот для WoW 3.3.5a AmbA 21.03.2026 без регистрации и смс. Это не торговля, приложение не содержит рекламы. Выполняет свою непосредственную задачу - автоматизацию рыбалки в WoW - и ничего более. Однако если админы будут против -. . .	1С: Программный отбор элементов справочника по значению перечисления Maks 21.03.2026 Установка программного отбора элементов справочника "Сотрудники" из модуля формы документа. В качестве фильтра для отбора служит значение перечислений. / / Событие "НачалоВыбора" реквизита на форме. . .

@thegrif 0 / 0 / 0 Регистрация: 17.11.2017 Сообщений: 6

	Блок div в высоту контейнера 17.11.2017, 10:49. Показов 1643. Ответов 9 Метки нет (Все метки) Здравствуйте. Ломаю голову. Как сделать что бы блок менюшки, растягивался при скроллинге в высоту блока с контентом. Например как тут: http://3wf.ru/ (серая менюка слева) (не реклама!!!) Применяю height: 100%; - но блок растягивается только в высоту экрана. Нужно что бы блок был min-height: 100%; (во всю высоту экрана, и растягивался при скролле, если в блоке с контентом много информации) Пожалуйста, помогите если не сложно 0

@thegrif 0 / 0 / 0 Регистрация: 17.11.2017 Сообщений: 6
	17.11.2017, 10:52 [ТС]
	Вот что выходит Миниатюры 0

@thegrif 0 / 0 / 0 Регистрация: 17.11.2017 Сообщений: 6
	17.11.2017, 11:11 [ТС]
	Для большего понимания: Блок 1 - Меню \| Блок 2 - Контент Если у блока 2 высота 1500px то Блок 1 тоже растягивался по высоте Блока 2. Добавлено через 7 минут Ничего не происходит. Пробовал. 0

@thegrif 0 / 0 / 0 Регистрация: 17.11.2017 Сообщений: 6
	17.11.2017, 11:29 [ТС]
	странно, пример очень хорошо работает, но когда в свой код интегрирую, ноль эффекта((( 0

@thegrif 0 / 0 / 0 Регистрация: 17.11.2017 Сообщений: 6
	17.11.2017, 14:00 [ТС]
	спасибо большое, вот это сработало! 0

Блок div в высоту контейнера

Решение