Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Высота DIV по ячейке-родителю. / 10 сообщений из 10, страница 1 из 1
26.02.2018, 18:22
    #39607455
vava
vava
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
Добрый день. Поиском я искал и нашел только вопросы, ответа не нашел.

В ячейке резиновой таблицы расположен DIV с высотой 100% (от ячейки) и в IE8 всё работало как хочется - лишнее содержимое DIV срезается не нарушая выставленных пропорций таблицы. В IE11 не получается привязаться к высоте ячейки - DIV распухает. Все вышестоящие объекты выставлены в 100%.
Как сделать размер ячейки таблицы независящим от содержимого?

Краткий пример:

Код: html
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.
<html style="width: 100%; height: 100%;">
    <body  style="width: 100%; height: 100%;">

        <table border=1 style="width: 100%; height: 100%;">
            <tr style="height: 50%;">
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr style="height: 50%;">
                <td>
                    <DIV style="height: 100%; overflow:auto;">
                        <table border="1" style="height: 100%;">
                            <tr><td>A01</td></tr>
                            <tr><td>A02</td></tr>
                            <tr><td>A03</td></tr>
                            <tr><td>A04</td></tr>
                            <tr><td>A05</td></tr>
                            <tr><td>A06</td></tr>
                            <tr><td>A07</td></tr>
                            <tr><td>A08</td></tr>
                            <tr><td>A09</td></tr>
                            <tr><td>A10</td></tr>
                            <tr><td>A11</td></tr>
                            <tr><td>A12</td></tr>
                            <tr><td>A13</td></tr>
                            <tr><td>A14</td></tr>
                            <tr><td>A15</td></tr>
                            <tr><td>A16</td></tr>
                            <tr><td>A17</td></tr>
                            <tr><td>A18</td></tr>
                            <tr><td>A19</td></tr>
                            <tr><td>A20</td></tr>
                        </table>
                    </DIV>    
                </td>
            </tr>
        </table>

    </body>
</html>



В пикселах выставить не получается - не известна высота таблицы, всякие min-height и max-height тоже не помогают - DIV не заполняет всю ячейку.

Про то, что можно выкинуть таблицу и сделать DIV-ми я знаю, а вот как сделать внутри таблицы?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.02.2018, 18:38
    #39607473
vava
vava
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
Если перевести браузер в режим совместимости, будет желаемая картинка.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 09:48
    #39607630
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
vava , а если размер давать не строкам, а ячейкам?

Код: html
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.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='https://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
html,
body {
	width: 100%; 
	height: 100%;
}
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<table border=1 style="width: 100%; height: 100%;">
	<tr>
		<td style="height: 50%;">
			&nbsp;
		</td>
	</tr>
	<tr>
		<td style="height: 50%;">
			<DIV style="height: 100%; overflow:auto;">
				<table border="1" style="height: 100%;">
					<tr><td>A01</td></tr>
					<tr><td>A02</td></tr>
					<tr><td>A03</td></tr>
					<tr><td>A04</td></tr>
					<tr><td>A05</td></tr>
					<tr><td>A06</td></tr>
					<tr><td>A07</td></tr>
					<tr><td>A08</td></tr>
					<tr><td>A09</td></tr>
					<tr><td>A10</td></tr>
					<tr><td>A11</td></tr>
					<tr><td>A12</td></tr>
					<tr><td>A13</td></tr>
					<tr><td>A14</td></tr>
					<tr><td>A15</td></tr>
					<tr><td>A16</td></tr>
					<tr><td>A17</td></tr>
					<tr><td>A18</td></tr>
					<tr><td>A19</td></tr>
					<tr><td>A20</td></tr>
				</table>
			</DIV>    
		</td>
	</tr>
</table>
</body>
</html>


У меня ИЕ9, в нем все "обрезается"...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 15:33
    #39607940
vava
vava
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
krvsa,
Спасибо за участие.
Не, не помогает, всё как было.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 15:44
    #39607950
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
vavaНе, не помогает, всё как было.
У меня нет ИЕ11... Даже посмотреть не на чем.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 16:08
    #39607965
vava
vava
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
krvsa,
Ну примерно так :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 16:41
    #39607985
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
vava,
у дива сделать display:block
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2018, 16:52
    #39607997
vava
vava
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
вадя,
Попробовал, не влияет.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.02.2018, 09:13
    #39608281
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
vava,

такое?
https://jsfiddle.net/ybf26Lv0/20/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.02.2018, 09:18
    #39608286
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Высота DIV по ячейке-родителю.
точнее так https://jsfiddle.net/ybf26Lv0/24/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Высота DIV по ячейке-родителю. / 10 сообщений из 10, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
созд. / загр.: 284ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1444265]:
 0ms
get settings:
 9ms
get forum list:
 12ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 175ms
get topic data:
 13ms
get forum data:
 3ms
get page messages:
 50ms
get tp. blocked users:
 2ms
others: 12ms
total:  284ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]