Вызначэнне памераў ўлёткі карты ўнутры пачатковай загрузкі

Я спрабаваў змяніць вышыню майго лістка карты ў працэнтах ўнутры пачатковай загрузкі, але кожны раз, калі я карта не будзе маляваць. Такім чынам, я заўсёды павінен вярнуцца да значэння рх. Я даволі ўпэўнены, што яго простая налада, што я прапускаю, бо я пачатковец CSS. Вось мой CSS.



5
Працоўны адказ на ГІС StackExchange сайта
дададзена аўтар JasonRDalton, крыніца
Працоўны адказ на ГІС StackExchange сайта
дададзена аўтар JasonRDalton, крыніца

10 адказы

Паспрабуйце дадаць вышыню ўласцівасць цела або бацькоўскі кантэйнер.

3
дададзена

Паспрабуйце дадаць вышыню ўласцівасць цела або бацькоўскі кантэйнер.

3
дададзена

<�Моцны> CCS

#map
{
    width: 100px;
    height:100px;
    min-height: 100%;
    min-width: 100%;
    display: block;
}

html, body
{
    height: 100%;
}

.fill
{
    min-height: 100%;
    height: 100%;
    width: 100%;
    min-width: 100%;
}

<�Моцны> HTML

<div class="container fill">
     <div id="map">

     </div> 
 </div>
1
дададзена
Чаму мноства мін-вышыня і мінімальная шырыня, калі яны фіксуюцца з шырынёй і вышынёй?
дададзена аўтар Javier Cabero, крыніца

<�Моцны> CCS

#map
{
    width: 100px;
    height:100px;
    min-height: 100%;
    min-width: 100%;
    display: block;
}

html, body
{
    height: 100%;
}

.fill
{
    min-height: 100%;
    height: 100%;
    width: 100%;
    min-width: 100%;
}

<�Моцны> HTML

<div class="container fill">
     <div id="map">

     </div> 
 </div>
1
дададзена
Чаму мноства мін-вышыня і мінімальная шырыня, калі яны фіксуюцца з шырынёй і вышынёй?
дададзена аўтар Javier Cabero, крыніца

З дапамогай CSS ад праекта Bootleaf на Github:

html,body, #map{
    height:100%;
    width: 100%;
overflow: hidden;
}
body {
    padding-top: 50px;
1
дададзена

З дапамогай CSS ад праекта Bootleaf на Github:

html,body, #map{
    height:100%;
    width: 100%;
overflow: hidden;
}
body {
    padding-top: 50px;
1
дададзена
body {
    padding: 0;
    margin: 0;
}
html, body, #map, .row-fluid{
    height: 100%;
}

#map {
    width: 100%;
}

.height-css
{
    height: 100%;
}

Ваш HTML будзе

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span12 height-css">
         <div id="map"></div> 
     </div>
   </div>
</div>
0
дададзена
body {
    padding: 0;
    margin: 0;
}
html, body, #map, .row-fluid{
    height: 100%;
}

#map {
    width: 100%;
}

.height-css
{
    height: 100%;
}

Ваш HTML будзе

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span12 height-css">
         <div id="map"></div> 
     </div>
   </div>
</div>
0
дададзена

У дадатак да ўстаноўцы ўласцівасць вышыня карты спраў да 100% можа спатрэбіцца для рэалізацыі гэта , каб пераканацца, што карта запаўняе DIV на змяненне памеру.

0
дададзена

У дадатак да ўстаноўцы ўласцівасць вышыня карты спраў да 100% можа спатрэбіцца для рэалізацыі гэта , каб пераканацца, што карта запаўняе DIV на змяненне памеру.

0
дададзена