Re: [css-d] Ghost space between DIVs

[Christian Kirchhoff]

Hello,

at the end of div#dnn_ctr414_ModuleContent there is a div.clear that 
has clear: both; defined in the css.


The right column is established by div#dnn_rightSideBar, which has 
float: right; defined.


Now clear: both;will look for any right or left floating element 
that comes before the clearing element and push the top egde of the 
clearing elemnnt down below the bottom edge of the floated element.


Intuitively - I thought that myself when I ran into that problem - you 
might say: But I only want that clearing div to clear those floating 
divs that are immediately above it in the left column.


But the clearing is performed in respect to a thing called Block 
Formatting Contexs.


Take a look here:
- http://communitymx.com/content/article.cfm?cid=6BC9D
- http://www.brunildo.org/test/clear.html

The trick is to change that context in a way that the clear will only 
affect the floated elements within the left column. A start would be 
to define float: left; for the div#dnn_ContentPane, because that 
would set a new block formatting context and then the clear: both; 
would only be influenced by element within the left column.


I hope that helps.

Best regards

Christian

Am 28.09.2010 00:07, schrieb Sébastien Fichot:

Hi ! I can't figure out why their is a white space between the two last
block of my webpage, they are not on the same master div and they act like
ghosts !!

If the block at right Derniers messages du forum grows, the block
Comprendre dotnetnuke rapidement at left is pushed down. ... does anyone
have a suggestion ? I am using Chrome on Mac OSX

Link :http://bit.ly/aGKQiZ

Screenshot :http://img59.imageshack.us/img59/6968/20100927235937.jpg

In yellow, the white space I would like to kill.
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ --http://css-discuss.incutio.com/
List policies --http://css-discuss.org/policies.html
Supported by evolt.org --http://www.evolt.org/help_support_evolt/


__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] [+] Ghost space between DIVs

[Thierry Koblentz]

 Hi ! I can't figure out why their is a white space between the two last
 block of my webpage, they are not on the same master div and they act
 like
 ghosts !!
 
 If the block at right Derniers messages du forum grows, the block
 Comprendre dotnetnuke rapidement at left is pushed down. ... does
 anyone
 have a suggestion ? I am using Chrome on Mac OSX
 
 Link : http://bit.ly/aGKQiZ
 
 Screenshot : http://img59.imageshack.us/img59/6968/20100927235937.jpg
 
 In yellow, the white space I would like to kill.

C'est normal :)

You are clearing two floats in the left column using div
class=clear/div
And your rule for that class is .clear {clear:both;} so what's happening is
that you are clearing the right column as well ;-)

A quick/easy fix is to replace both with left.
A better fix would be to get rid of the empty div you're using and go with a
technique that contains floats without structural markup.

You could try:

#dnn_ctr414_ContentPane {
  display:inline-block;
  Width:520px;
}

--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz

__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/