ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Растяжение блоков по высоте экрана
7 сообщений из 7, страница 1 из 1
Растяжение блоков по высоте экрана
    #38121416
urukhay
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
urukhay
Участник
Добрый день. Есть вот такой небольшой html-чик:
Код: 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.
<html>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
    <tr>
        <td valign="top" height="100%">
            <div style="border:5px solid red; height:100%;">
                <table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
                    <tr>
                        <td valign="top" style="height:100%; background:green;">
                            <div height="100%" style="border:5px solid black;">
                                <table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
                                    <tr>
                                        <td height="100%">asdf</td>
                                    </tr>
                                </table>                                
                            </div>
                        </td>
                    </tr>
                </table>                                                  
            </div>
        </td>
    </tr>
</table>
</body>
</html>



Нужно, чтобы все элементы были растянуты по высоте на весь экран. Подскажите плиз, как это сделать. Полдня уже бьюсь, ничего не помогает. Плюс, можно увидеть, что в опере и в хроме отображается по-разному. Причем и там и там не так, как надо!
...
Рейтинг: 0 / 0
23.01.2013, 14:18
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38121765
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
urukhayНужно, чтобы все элементы были растянуты по высоте на весь экран. Подскажите плиз, как это сделать.
Например так...

Код: 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.
<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}
html,
body {
	width: 100%;
	height: 100%;
}
table {
	width: 100%;
	height: 100%;
}
td {
	height: 100%;
}
div {
	height: 99%;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td>
            <div style="border:5px solid red;">
	            <table border="0" cellpadding="0" cellspacing="0">
                    <tr>
                        <td valign="top" style="background-color:green;">
                            <div style="border:5px solid black;">
                                <table border="0" cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td>asdf</td>
                                    </tr>
                                </table>                                
                            </div>
                        </td>
                    </tr>
                </table>                                                  
            </div>
        </td>
    </tr>
</table>
</body>
</html>


Только нужно с границами у ДИВов поработать... Если их убрать - все будет по 100%.
...
Рейтинг: 0 / 0
23.01.2013, 16:19
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38121870
Wadim S
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Wadim S
Участник
krvsaТолько нужно с границами у ДИВов поработать... Если их убрать - все будет по 100%.

С границами можно решить так:

Код: css
1.
2.
3.
4.
5.
div {
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
...
Рейтинг: 0 / 0
23.01.2013, 17:01
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38122353
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Wadim SС границами можно решить так:

Код: css
1.
2.
3.
4.
5.
div {
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}


Да как понравится - так и решай...
...
Рейтинг: 0 / 0
23.01.2013, 22:39
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38122978
urukhay
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
urukhay
Участник
Спасибо большое! Работает везде, даже в ИЕ6 :)
А подскажите еще, что означает в стилях
* {}
Меня интересует сама звездочка - что это такое?
...
Рейтинг: 0 / 0
24.01.2013, 12:34
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38123107
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
urukhayчто означает в стилях
Код: css
1.
* {}


Меня интересует сама звездочка - что это такое?
* - любой тег
...
Рейтинг: 0 / 0
24.01.2013, 13:40
| Ответить | Цитировать | Написать  
Растяжение блоков по высоте экрана
    #38123189
urukhay
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
urukhay
Участник
Ясно, спасибо еще раз!
...
Рейтинг: 0 / 0
24.01.2013, 14:14
| Ответить | Цитировать | Написать  
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Растяжение блоков по высоте экрана
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38123189&tid=1448819]:
 0ms
get settings:
 7ms
get forum list:
 14ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 53ms
get topic data:
 9ms
get forum data:
 2ms
get page messages:
 45ms
get tp. blocked users:
 1ms
others: 214ms
total:  349ms
созд. / загр.: 349ms
x
x
Закрыть


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