How to check if clearfix is working

HTML & CSS
1

Hi all
I have added this code to my website to get rid of an empty div that was used to clear elements. Stupid question apologies in advance but how can I check if the clearfix is working? I commented out the css and it doesn’t make any difference the page looks the same. Thanks


/* new clearfix */ 
.clearfix:after {     
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
} 
* html .clearfix             { zoom: 1; } /* IE6 */ 
*:first-child+html .clearfix { zoom: 1; } /* IE7 */ 


<div class="floatingrightmenu clearfix">This floats right</div> <p>This text is cleared below it.</p>
2

The point of clearfix is to apply it to a parent container that is not floated but which contains floated children. If the container is not floated but its content are, the contents will hang out. Clearfix stops that. Since this div is already floated, you don’t need it. You may have applied it to the wrong element.

3

Much less that ‘clearfix’ is an unnecessary bloated useless construct that has no business being used on 99% of the pages people apply it to… though Ralph kind of hit it on the head, your question and your code don’t make any sense.

4

Hi deathshadow yeah I am trying to use it in the way Ralph explained. I am changing

<div class="cleared"></div>

to clearfix according to a tutorial I am following (found when googling).
This is legacy html on a wordpress theme I’m customizing, so my initial question was because I was questioning the reason for

<div class="cleared"></div>

being there in the first place. I couldn’t actually see any error or change when I deleted the line so I was just wondering in what instances it would create problems without it. Anyway I think it may have just been that the wordpress theme html was badly written and now my new clean code has got rid of that issue or needing to clear content. Hope I (: am making sense!