1

Please check the demo link I just want to adjust Geomap div's height to 100%. I have tried with this Javascript below but its overflowing with the footer.

function handleResize() {
var h = $('html').height();
        $('#map-geo').css({'height':h+'px'});
}
$(function(){
        handleResize();
        $(window).resize(function(){
        handleResize();
    });
});

Currently my Html and Body css is 

html, body {
    font-family: 'Open Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    height:69% !important;
    width:100% !important;  

}

Please do help me out to make it fit.

Debabrat Pradhan
  • 187
  • 6
  • possible duplicate of [Make a div fill the height of the remaining screen space](http://stackoverflow.com/questions/90178/make-a-div-fill-the-height-of-the-remaining-screen-space) – Elezar Apr 16 '15 at 21:42
  • Well, you're setting html to 69% of the viewport height, and then setting #map-geo to match that. That assumes that everything besides #map-geo that takes up height will be 31% of the viewport. That's not always going to be true, depending on the size of the viewport. What you're asking for essentially the same thing as asked in http://stackoverflow.com/questions/90178/make-a-div-fill-the-height-of-the-remaining-screen-space. There are a few options there to choose from. – Elezar Apr 16 '15 at 21:43

1 Answers1

1

as far as i know you should replace : 

$('#map-geo').css({'height':h+'px'});

with :

$('#map-geo').css('height',h+'px');

And you also need to put the whole function into :

$( document ).ready(function() {
});

You can try this, if it works for you : 

$( document ).ready(function() {
        function handleResize() {
        var h = $('html').height();
            $('#map-geo').css('height',h+'px');
        }
        handleResize();
    });

This alone should resize the element.

Redrif
  • 650
  • 4
  • 22
  • Working like a charm, check the link once again and do let me know whats wrong with my first code ? Also do let me know how to adjust the overlapping Footer while resizing? – Debabrat Pradhan Apr 17 '15 at 04:43