CSS3: Iframe nicht 100% Höhe

Ich habe 2 Bootstrap-Spalten.CSS3: Iframe nicht 100% Höhe

in der ersten Spalte gibt es eine feste Position div. und in der 2. Spalte habe ich ein iframe div. Ich habe iframe height = "100%" angegeben, aber es dauert nicht 100% des Browsers.

.left_side_div{ 
 
    width:25%; 
 
    min-height:100%; 
 
    background : #FFFFFF; 
 
    position:fixed; 
 
    top:0; 
 
    left:0; 
 
    bottom:0; 
 
    border:thin black solid; 
 
} 
 

 
.iframe_div{ 
 
    width:100%; 
 
    height:100%; 
 
    border:thin black solid; 
 
    
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<div class="row"> 
 
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3"> 
 
    <div class="left_side_div"></div> 
 
</div> 
 
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9"> 
 
    <div class="iframe_div"> 
 
    <iframe src="http://google.co.in/" width="100%" height="100%"></iframe> 
 
    </div> 
 
</div> 
 
</div>

Hier ist JSFiddle

Jede Hilfe wäre toll.

Vielen Dank.

Quelle

2017-07-07 Anonymous

Verwenden Sie nicht% für Höhe nicht verwendet 100vh.

Quelle

2017-07-07 09:37:23 arracso

wenn ich verwende 100vh dann bekomme ich 2 Bildlaufleisten. einer der Browser und ein anderer der iframe. Ich habe nur 2 div auf der ganzen Seite. 1. das ist von links und auf der rechten Seite wird der ganze iframe da sein. –

@Rishi Verwenden Sie 'Überlauf: versteckt' mit 'Höhe: 100vh' – zer00ne

möchte nur fragen, dass IE10, IE11 und Safari-Browser 100vh unterstützen ?? –

Verwendung Marge 0 für Zeile

.row{ 
    margin: 0; 
}

Quelle

2017-07-07 09:49:18

CSS3: Iframe nicht 100% Höhe

Antwort

Verwandte Themen