3 Replies - 1088 Views - Last Post: 12 November 2009 - 07:29 AM

#1 Solaiman  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 24
  • Joined: 10-September 09

wrapper don't extend ! why ?

Posted 12 November 2009 - 12:51 AM

hello !!!


when add the content and side bar !!!

the wrapper dont extend

why ?


this code and the photo in attachment !!!

plz help me :) Attached ImageAttached Image


#wrapper{
	width:800px;
	background:#FFFFFF repeat;
	padding: 15px 15px 15px 15px;
	margin:auto;
	border:solid 1px #fff;
	-moz-border-radius: 8px;
}


#content{
width:500px;
height:100px;
background:#fff231;
float:left;


}
#sidebar{
float:right;
background:#fff323;
width:150px;
height:100px;
}





and thx for every thing

Is This A Good Question/Topic? 0
  • +

Replies To: wrapper don't extend ! why ?

#2 bammurdo  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 3
  • View blog
  • Posts: 62
  • Joined: 03-October 09

Re: wrapper don't extend ! why ?

Posted 12 November 2009 - 05:37 AM

Could you post your HTML as well :)?


I can't get my head around this sorta of thing either :P
I think you could add :"min-hieght:100px;" to your wrapper CSS, that should work :), but im not a pro at CSS yet :)

Give it a try :)
bam ;)

Edit:

Btw, is your html like :

<div id="Wrapper">
	 <div id="Content" >
		  <!-- Contentness -->
	 </div>
	 <div id="Sidebar" >
		  <!-- Links -->
	 </div>
</div>


?

This post has been edited by bammurdo: 12 November 2009 - 05:41 AM

Was This Post Helpful? 0
  • +
  • -

#3 thehat  Icon User is offline

  • awake ? web();
  • member icon

Reputation: 106
  • View blog
  • Posts: 951
  • Joined: 28-February 08

Re: wrapper don't extend ! why ?

Posted 12 November 2009 - 07:08 AM

It's because both your content and your sidebar are floated, which takes them out of the flow of the document and stops them affecting the parent's height. A trick to fix this is to create another div after your content and sidebar and set it to clear:both, which will force it to sit below your other divs and force the height of the parent container.

div#myClearDiv {
	font-size:1px;
	line-height:1px;
	clear:both;
}


Was This Post Helpful? 0
  • +
  • -

#4 Solaiman  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 24
  • Joined: 10-September 09

Re: wrapper don't extend ! why ?

Posted 12 November 2009 - 07:29 AM

View Postbammurdo, on 12 Nov, 2009 - 04:37 AM, said:

Could you post your HTML as well :)?


I can't get my head around this sorta of thing either :P
I think you could add :"min-hieght:100px;" to your wrapper CSS, that should work :), but im not a pro at CSS yet :)

Give it a try :)
bam ;)

Edit:

Btw, is your html like :

<div id="Wrapper">
	 <div id="Content" >
		  <!-- Contentness -->
	 </div>
	 <div id="Sidebar" >
		  <!-- Links -->
	 </div>
</div>


?


thx for try !! dos'nt work !! :)


View Postthehat, on 12 Nov, 2009 - 06:08 AM, said:

It's because both your content and your sidebar are floated, which takes them out of the flow of the document and stops them affecting the parent's height. A trick to fix this is to create another div after your content and sidebar and set it to clear:both, which will force it to sit below your other divs and force the height of the parent container.

div#myClearDiv {
	font-size:1px;
	line-height:1px;
	clear:both;
}




thx very very much !!


worked :))
Was This Post Helpful? 1

Page 1 of 1