div absolute не растягивает родительский div relative

Oriy · April 18, 2011

Содержание div absolute меняется по высоте, но не растягивает родительский div relative! Как сделать так чтобы он растягивался???

Пример кода:

<!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>Untitled Document</title>

<style type="text/css">
<!--
* {
	margin: 0px;
	padding: 0px;
}
.wraper {
	margin: 0px;
	padding: 0px;
	text-align: center;
}
.container {
	width: 960px;
	position: relative;
	text-align: left;
	background-color: #CCCCCC;
	color: #FFFFFF;
}
.header {
	height: 100px;
	background-color: #339900;
	padding: 10px;
}
.left {
	display: inline-block;
	float: left;
	width: 200px;
	background-color: #FF0000;
	padding: 10px;
}
.content {
	display: inline-block;
	float: right;
	text-align: left;
	width:700px;
	background-color: #0000FF;
	padding: 10px;
}
.home {
	position: relative;
	background-color: #00FFFF;
	height: 100%;
}
.feature {
	position: absolute;
	background-color: #FFFF00;
}
-->
</style>
</head>

<body>
<div class="wraper">
<div class="container">
  <div class="header"> Content for  class "container" Goes Here</div>
  <div class="left">Content for  class "left" Goes Here</div>
  <div class="content">
    <div class="home">
      <div class="feature">Content for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes HerContent for  class "content" Goes Her</div>
      </div>
  </div>
</div>
</div>
</body>
</html>

Great Rash · April 18, 2011

Никак. Абсолютный див не может влиять на остальной контент. В этом весь смысл абсолютного элемента.

Oriy · April 18, 2011

Благодарю! Все же надеялся, что я что нибудь забыл!)))

Видимо только через JavaScript!

Sign In

div absolute не растягивает родительский div relative

Question

Oriy

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

Great Rash

Link to comment

Share on other sites

Oriy

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information