Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.09.2013, 15:55
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

div-header, div-content, dic-footer в ячейке таблицы
Здравствуйте. Никак не пойму как мне сделать - есть ячейка, в этой ячейке сделать div-header, div-content("резиновый"), div-footer. div-header и div-footer постоянной, заданной величины, div-content чтобы растягивался между ними.
Сейчас сделано так

Код:
#content_mess
{
	 height: 465px;
	 overflow: auto;
}
#tr_comments
{
	/*height: 45px;*/
	vertical-align:top
}
#comments
{
	resize: none;
	margin-left: 10px;
	margin-right: 10px;
	
}
<table width='100%' height='100%' id='mes_dialog' style='border-collapse: collapse;'>
<tr>
  <td style='padding-left: 20px;'><font style='color: #2878af; font-size: 21px; font-family: Segoe_light;'>family</font><br/>последнее сообщение: 23.09 в 11-23</td>
  <td align='right' valign='top' style='padding-right: 20px;'><font style='color: #2878af; font-family: Segoe_light;'>в сети</font></td>
</tr>
<tr>
  <td colspan='2'><div id='content_mess'><div class='line-1'></div></div></td>"
</tr>
<tr id='tr_comments' align='center' valign='middle' bgcolor='#E8E8E8'>"
  <td style='padding: 15px 5px 15px 10px' ><textarea id='comments' rows='1' cols='70'>Мухаха</textarea></td>" +
  <td style='padding: 15px 10px 15px 5px' ><button id='send_mess'><font style='font-family: Segoe_light;'>Отправить</font></button></td>
</tr>
</table>


Заранее спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 12.09.2013, 16:15
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от valyan
есть ячейка
Какая из этих? У тебя в пример несколько строк в таблице...
Ответить с цитированием
  #3 (permalink)  
Старый 12.09.2013, 16:51
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

Вот там, где выделено разными цветами. Сейчас я это делаю с помощью таблицы(см. сообщение №1), т.е. таблица в таблице.
Изображения:
Тип файла: jpg 11.jpg (5.2 Кб, 4 просмотров)
Ответить с цитированием
  #4 (permalink)  
Старый 12.09.2013, 19:50
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

Что посоветуете?
Ответить с цитированием
  #5 (permalink)  
Старый 12.09.2013, 22:34
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от valyan
Что посоветуете?
создать нормальный тестовый пример, добавить возможность запуска [html run]
Ответить с цитированием
  #6 (permalink)  
Старый 12.09.2013, 23:13
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>
</head>

<body>
<table width="100%" height="100%" border="1">
  <tr>
    <td height="53" colspan="2">&nbsp;</td>
  </tr>
  <tr>
    <td width="23%">&nbsp;</td>
    <td width="77%"><div id="header">
      <div id="content" style=" border: 1px solid black;">Здесь располагается содержимое div c  id "header"</div>
    </div>
    <div id="content" style=" border: 1px solid green;">Здесь располагается содержимое  div c  id "content"</div>
    <div id="footer" style=" border: 1px solid red;">Здесь располагается содержимое  div c  id "footer"</div></td>
  </tr>
</table>

</body>
</html>


Только div c id "header" должен быть вверху ячейки, div c id "footer" внизу ячейки, div c id "content" - растягиваться между ними.
Ответить с цитированием
  #7 (permalink)  
Старый 12.09.2013, 23:24
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от valyan
<div id="content" style=" border: 1px solid black;">Здесь располагается содержимое div c  id "header"</div>
    </div>
    <div id="content" style=" border: 1px solid green;">Здесь располагается содержимое  div c  id "content"</div>
Сообщение от valyan
Только div c id "header" должен быть вверху ячейки, div c id "footer" внизу ячейки, div c id "content" - растягиваться между ними.
а чё сам не добавил? к чему два id="content"?

как растягиваться, он и так у тебя растянут между ними
Ответить с цитированием
  #8 (permalink)  
Старый 13.09.2013, 08:27
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

Сообщение от bes Посмотреть сообщение
к чему два id="content"?
Просто описка

Сообщение от bes Посмотреть сообщение
как растягиваться, он и так у тебя растянут между ними
Ну вот если на всю страницу сделать, то эти дивы будут все в центре, а мне надо - фиксировано один в "шапке", другой всегда фиксировано снизу, а третий между ними.

Последний раз редактировалось valyan, 13.09.2013 в 08:30.
Ответить с цитированием
  #9 (permalink)  
Старый 13.09.2013, 10:00
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,225

Сообщение от valyan
Что посоветуете?
Вообще избавиться от таблицы.
Поскольку ты попадаешь на проблему "как сделать див на всю область резиновой ячейки"...
Ответить с цитированием
  #10 (permalink)  
Старый 13.09.2013, 16:14
Аспирант
Отправить личное сообщение для valyan Посмотреть профиль Найти все сообщения от valyan
 
Регистрация: 05.11.2012
Сообщений: 55

Сообщение от ksa Посмотреть сообщение
Вообще избавиться от таблицы.
Поскольку ты попадаешь на проблему "как сделать див на всю область резиновой ячейки"...
Ну допустим не в таблице, как это сделать с помощью дивов
<div id="main" style="border: 1px solid black; width: 100%; height: 100%">
 <div id="header" style="border: 1px solid red; height: 10%"></div>
 <div id="content" style="border: 1px solid green; height: 80%"></div>
 <div id="footer" style="border: 1px solid blue; height: 10%"></div>
</div>

Как это сделать?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Резиновый дизайн debugx (X)HTML/CSS 22 19.08.2011 16:35
Не получается поменять высоту div revvo jQuery 4 06.08.2011 13:12