Organizational Research By

Surprising Reserch Topic

why is the height property with percentage value not working on my div


why is the height property with percentage value not working on my div  using -'jquery,html,css'

I have styling problem.

Below is my code

<div style="height: 90%">
    <div ng-controller="TabsDataCtrl" style="width: 20%; float: left;">
        <tabset>
            <tab id="tab1" heading="{{tabs[0].title}}" ng-click="getContent(0)" active="tabs[0].active"
               disabled="tabs[0].disabled">
            </tab>


            <tab id="tab2" heading="{{tabs[2].title}}" ng-click="getContent(2)" active="tabs[2].active"
                 disabled="tabs[2].disabled">
            </tab>
        </tabset>
    </div>

    <div id="leaflet_map" ng-controller="iPortMapJobController">
        <leaflet center="center" markers="markers" layers="layers" width="78%"></leaflet>
    </div>
    </div>


And the screenshot attached.  The problem is the styling, if you see both the div's have a height of 90% but the display is different.

I have tried to put an outer div but that has not helped. Can someone explain why I am having this problem. Also, its the same on FF, Chrome, Opera & Safari.
    
asked Sep 15, 2015 by CarolineCade
0 votes
53 views



Related Hot Questions



Government Jobs Opening


...