Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Растяжение блоков по высоте экрана / 7 сообщений из 7, страница 1 из 1
23.01.2013, 14:18
    #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, 16:19
    #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, 17:01
    #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, 22:39
    #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
| Ответить | Цитировать | Написать  
24.01.2013, 12:34
    #38122978
urukhay
urukhay
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Растяжение блоков по высоте экрана
Спасибо большое! Работает везде, даже в ИЕ6 :)
А подскажите еще, что означает в стилях
* {}
Меня интересует сама звездочка - что это такое?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
24.01.2013, 13:40
    #38123107
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Растяжение блоков по высоте экрана
urukhayчто означает в стилях
Код: css
1.
* {}


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


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