проблема с таблицей

akahitokiri · March 25, 2011

Господа подскажите как сделать так чтобы в левой колонке верхний блок и нижний всегда прижисались соответсвенно к низу и верху в независимости от размера контента. Пока получается так но чего то не хватает.

<table width="422" border="0" cellspacing="0" cellpadding="0">
  <tr valign="top">
    <td><table height="100%" width="211" border="0" cellspacing="0" cellpadding="0">
  <tr valign="top">
    <td height="300"> </td>
  </tr>
  <tr>
    <td height="auto"> </td>
  </tr>
  <tr valign="bottom">
    <td height="300"> </td>
  </tr>
</table>
</td>
    <td>Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br /></td>
  </tr>
</table>

Edited March 25, 2011 by akahitokiri

psywalker · March 25, 2011

Всем родителям выставить высоту, вплоть до html!

akahitokiri · March 25, 2011

нет не то

не помогает

psywalker · March 25, 2011

1. Покажи скриншот того, что ты хочешь получить.

1. Покажи тестовую страницу.

akahitokiri · March 25, 2011

1. Покажи скриншот того, что ты хочешь получить.
1. Покажи тестовую страницу.

вот что хочу

вот как делаю

<!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>
<style type="text/css">
* {
	margin:0;
	padding:0;
}
html, body {
	height:100%;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table height="100%" width="1211" border="0" cellspacing="0" cellpadding="0">
  <tr valign="top">
    <td width="211"><table height="100%" width="211" border="0" cellspacing="0" cellpadding="0">
  <tr valign="top">
    <td height="300"> </td>
  </tr>
  <tr>
    <td height="auto"> </td>
  </tr>
  <tr valign="bottom">
    <td height="300"> </td>
  </tr>
</table>
</td>
    <td width="1000">Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br />Text<br /></td>
  </tr>
</table>
</body>
</html>

Edited March 25, 2011 by akahitokiri

tius · March 25, 2011


<!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>
<style type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
* {
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
	margin: 0;
}
table {
	height: 100%;
	width: 100%;
}
table td {
	border: 1px solid #808080;
	vertical-align: top;
}
</style>
<title>Untitled Document</title>
</head>

<body>
<table>
<tr>
	<td>left</td>
	<td rowspan="3">right</td>
</tr>
<tr>
	<td>left</td>
</tr>
<tr>
	<td>left</td>
</tr>
</table>
</body>
</html>

Чувствую, окажется, что левая колонка должна быть всегда на месте и в одном и том же виде, независимо от наполнения правой колонки. Если так, то юзать слои и position:fixed.

akahitokiri · March 25, 2011

<!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>
<style type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
* {
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
	margin: 0;
}
table {
	height: 100%;
	width: 100%;
}
table td {
	border: 1px solid #808080;
	vertical-align: top;
}
</style>
<title>Untitled Document</title>
</head>

<body>
<table>
<tr>
	<td>left</td>
	<td rowspan="3">right</td>
</tr>
<tr>
	<td>left</td>
</tr>
<tr>
	<td>left</td>
</tr>
</table>
</body>
</html>
Чувствую, окажется, что левая колонка должна быть всегда на месте и в одном и том же виде, независимо от наполнения правой колонки. Если так, то юзать слои и position:fixed.

спасибо с некоторыми изменениями смогу применить

psywalker · March 25, 2011

tius

1. Как я понял, верхняя и нижняя колонки должны иметь фикс высоту? Если так, то в ИЕ такая вещь не прокатывает.

2. Причём тут fixed?

tius · March 25, 2011

psywalker

>1. Как я понял, верхняя и нижняя колонки должны иметь фикс высоту? Если так, то в ИЕ такая вещь не прокатывает.

А я так понимаю, что просто границы должны быть прижаты к краям браузера.

>2. Причём тут fixed?

В случае, если левая колонка должна всегда иметь 100% от видимой рабочей области браузера и всегда быть на одном месте, какой бы длинной не была правая колонка. К счастью, этот вариант ОПу не нужен.

Edited March 26, 2011 by tius

psywalker · March 25, 2011

tius

Ладно, делаю тебя главным по таблицам

Sign In

проблема с таблицей

Question

akahitokiri

Link to comment

Share on other sites

9 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

akahitokiri

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

akahitokiri

Link to comment

Share on other sites

tius

Link to comment

Share on other sites

akahitokiri

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

tius

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information