iFrame Height Auto (CSS)

Question

I am having problems with my iframe. I really want the frame to auto adjust heights according to the content within the iframe. I really want to do this via the CSS without

Answer 1

You should note that div tag behaves like nothing and just let you to put something in it. It means that if you insert a paragraph with 100 lines of text within a div tag, it shows all the text but its height won't change to contain all the text.

So you have to use a CSS & HTML trick to handle this issue. This trick is very simple. you must use an empty div tag with class="clear" and then you will have to add this class to your CSS. Also note that your have #wrap in your CSS file but you don't have any tag with this id. In summary you have to change you code to something like below:

HTML Code:

    
    
    
        

        

        
 
            home
            about
            fanlisting
            100 reasons
            letter
        
        

            
Update Information
            

            
            

        
        

        

        
        

    

And also add this line to your CSS file:

.clear{ display: block; clear: both;}