Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
Floating Child Divs height not inherited by Parent Div
Old 09-11-2009, 06:17 AM Floating Child Divs height not inherited by Parent Div
neojohan's Avatar
Novice Talker

Posts: 1
Name: John Michael Sales
Location: Philippines
Trades: 0
[font="Arial"]When using float: left or right in Child divs, make sure to add position: relative to them. And add overflow: hidden in their Parent div. The Parent div will inherit the height of his Child divs. The code below will show you want I mean.

Code:
<style type="text/css">
.body {
	background-color: #000;
	height: auto;
	position: relative;
	overflow: hidden;
	width: 500px;
}
.left {
	background-color: #00F;
	float: left;
	height: 400px;
	position: relative;
	width: 200px;
}
.right {
	background-color: #F00;
	float: right;
	height: 600px;
	position: relative;
	width: 300px;
}
</style>
<div class="body">
  <div class="left"></div>
  <div class="right"></div>
</div>
image removed see forum rules!!
__________________
John Michael Sales
CSS/Web Programmer

Please login or register to view this content. Registration is FREE

Last edited by chrishirst; 09-11-2009 at 07:52 AM..
neojohan is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 09-11-2009, 07:51 AM Re: Floating Child Divs height not inherited by Parent Div
chrishirst's Avatar
Missing! presumed drunk.

Posts: 41,519
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
A a parent element CANNOT inherit from child elements.

As in real life, children inherit FROM the parent.
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?

Last edited by chrishirst; 09-11-2009 at 07:52 AM..
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 09-11-2009, 07:53 AM Re: Floating Child Divs height not inherited by Parent Div
chrishirst's Avatar
Missing! presumed drunk.

Posts: 41,519
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
BTW I suggest you read the sticky thread http://www.webmaster-talk.com/css-fo...d.php?t=167681 it's why we have them in a prominent place!!
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 09-14-2009, 05:30 PM Re: Floating Child Divs height not inherited by Parent Div
LadynRed's Avatar
Defies a Status

Posts: 10,016
Location: Tennessee
Trades: 0
I'll also add that putting position:relative on EVERY floated div (or element) is not a good way to approach the problems.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!

Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE

LadynRed is offline
Reply With Quote
View Public Profile
 
Reply     « Reply to Floating Child Divs height not inherited by Parent Div
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 1.52907 seconds with 12 queries