Page size equal to the size of the IFrame

1

How do I make a page that is running inside an IFrame exactly the same as the IFrame? My IFrame has 700px X 500px, but the page that is running inside it takes up half the IFrame or less and creates horizontal and vertical scrolling. How I do? I already researched the net and only found the size of the IFrame, but the page inserted in it. Passing parameters to the IFrame (page). Note that it has a width = 700 and a heigth = 500:

../../ace/ace005a.asp?/GEN/ASP/GEN0001a.asp$$ind_situacao=&tipo_empresa=&ind_classificacao=&p_cod_tipo_contrato=&indsubmit=false&txt_nome_campo_cod=num_contrato&txt_nome_campo_cod_ts=cod_ts_contrato&txt_nome_campo_desc=nome_contrato&ind_tipo_pessoa=J&funcao_executar=PesquisaContratoMontaFilial();&abre_modal=S&ind_alteracao_contrato=&tipo_preco=", "Pesquisa Contrato", 700, 500

See how the page looks inside. The Frame is large, but the inside page is less than half the IFrame.

    
asked by anonymous 05.08.2015 / 20:47

2 answers

1

The content you are entering is greater than 700x500, so the scroll bars ... Using a responsive layout vc solves the problem of horizontal scrolling. This can be done with bootstrap or foundation, since the vertical scroll bar must exist to ensure that information is not omitted.

Example using the bootstrap ( link ) to write a form page:

                           Form

<!-- Bootstrap -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><scriptsrc="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

  

<form>
    <div class="form-group">
        <label for="exampleInputEmail1">Email address</label>
        <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
    </div>
    <div class="form-group">
        <label for="exampleInputPassword1">Password</label>
        <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
    </div>
    <div class="form-group">
        <label for="exampleInputFile">File input</label>
        <input type="file" id="exampleInputFile">
        <p class="help-block">Example block-level help text here.</p>
    </div>
    <div class="checkbox">
        <label>
            <input type="checkbox"> Check me out
        </label>
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script><!--Includeallcompiledplugins(below),orincludeindividualfilesasneeded--><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    
06.08.2015 / 15:27
0

It may not be the best solution if your page content is dynamic and can be larger than the iframe, but try scrolling="no" to disable scrolling in the iframe.  

And in the width and height of the page in the src of the iframe puts 100% so that occupy all the space available in the iframe.

    
05.08.2015 / 21:04