Jump to content
  • 0

Извиняюсь, но с нова про height 100%

scott2to

Asked by scott2to,

 Share

Question

scott2to Explorer

scott2to

Posted
Posted

Вот пример:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>

<table align="center" border='1' cellspacing='0'>
 <tr>   
  <td>
  — — — —<br /><br />
  — — — —<br /><br />
  — — — —<br /><br />
  — — — —<br /><br />
  — — — —<br /><br />
  </td>
  <td valign='top'>

	<div style='border:1px solid red;height:100%;'>
	    !!!!!!!!!!
    </div>
  </td>
 </tr>
</table>

</body>
</html>

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

Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0
scott2to Explorer

scott2to

Posted
  • Author
Posted 
— — — —<br /><br />
— — — —<br /><br />
— — — —<br /><br />
— — — —<br /><br />
— — — —<br /><br />

что это, беримор?????

Котлеты? =)

Это контент))

:)

Поставь для боди и штмл высоту 100%. А таблице высоту просто не задавай..

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

Link to comment
Share on other sites
  • 0
spdif Explorer

spdif

Posted
Posted
Когда в левом столбце контента много див остается размером таким же как изначально. А как сделать так что бы он расширялся по контенту?

Если верст именно такой как у тебя, то с этим типом !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" да и с любым другим тоже то скорей всего ничо не получицо :)

Но если оч хочется и отбросив условности порождаемые рациональным смыслом, то в принципе реализовать такое легко но только без использования DOCTYPE

вот пример:

<html>

<style>
table { width: 100%; }
table, tr, td { border: 1px solid black; }
tr, .storage { height: 100%; }
.lcol { width: 70%; }
.rcol { width: 30%; }
.storage { font-size: 16px; }
.abstraction { border: 1px solid red; }
</style>

<body>
	<table>
		<tr>
			<td class="lcol">
				sdf <br>hjk tyu awe <br>mcq jco 
				syw <br>hxv uiq cvb <br>jkl asw
				<br>ytu kjh<br> hjk tyu awe <br>
				mcq jco syw <br>hxv uiq cvb <br>
				jkl asw <br>ytu kjh tyu awe <br>
				mcq jco syw <br>hxv uiq cvb <br>
				jkl asw <br>ytu kjh awe <br>mcq 
				jco syw <br>hxv uiq cvb <br>jkl 
				asw <br>ytu kjh<br> mcq jco syw 
				<br>hxv uiq cvb <br>jkl asw <br>
				ytu kjh jco syw <br>hxv uiq cvb 
				<br>jkl asw <br>ytu kjh syw <br>
				hxv uiq cvb <br>jkl asw <br>ytu 
				kjh<br>hxv  uiq cvb <br>jkl asw
				<br>ytu kjh uiq cvb <br>
			</td>
			<td class="rcol">
				<div class="storage abstraction">
					sdf hjk tyu awe mcq jco syw hxv 
					uiq cvb jkl asw ytu kjh<br> hjk 
					tyu awe mcq jco syw hxv uiq cvb 
					jkl asw ytu kjh<br> tyu awe mcq 
					jco syw hxv uiq cvb jkl asw ytu 
					kjh<br> awe mcq jco syw hxv uiq 
					cvb jkl asw ytu kjh<br> mcq jco 
					syw hxv uiq cvb jkl asw ytu kjh
					<br>jco syw hxv uiq cvb jkl asw 
					ytu kjh<br> syw hxv uiq cvb jkl 
					asw ytu kjh<br> hxv uiq cvb jkl 
					asw ytu kjh<br> uiq cvb jkl asw 
					ytu kjh<br> cvb jkl asw ytu kjh
					<br>jkl asw ytu kjh<br> asw ytu 
					kjh<br> ytu kjh<br> kjh<br>
				</div>
			</td>
		</tr>
	</table>
</body>

</html>

Однако для данного примера всеже нашелся один DOCTYPE с которым это будет работать

!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"

Только есть ли во всем этом смысл? вот в чем вопрос. :)

Link to comment
Share on other sites
  • 0
Searcher Explorer

Searcher

Posted
Posted

div в таблицы вставлять - много проблем наживать! ))

DOCTYPE не стоит менять, проблемы с кроссброузерностью будут.

Сверстать такое легко и без таблицы.

А, вообще, зачем Вам растягивать этот див по высоте больше содержимого? Чтобы создать фон на всю высоту? Так задайте фон ячейке, в которой находится этот див.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept