Autor Zpráva
Divade
Profil *
Ahoj,

řeším dva problémy současně. První je, že potřebuji obrázek na pozadí a aby se měnil podle velikosti zařízení. A druhý je, že mám formulář a ten potřebuji vertikálně na střed.

Podařilo se mi to splácat z toho, co jsem našel na netu. Funguje to, ale je tam jeden problém. Pokud něco napíšu hned pod div scroller (chci totiž, aby to bylo úplně nahoře stránky), posune mi to formulář, ten už není ve středu a na straně se objeví posuvník. Jak docílit toho, abych mohl normálně do stránky psát text a kód a formulář stále zůstal na středu? Zde je použitý kód.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<style type="text/css">
html {
  height: 100%;
  width: 100%;
  overflow: hidden;
  min-width: 100%;
  min-height: 100%;
}

body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

.container-fluid{
  height:100%;
  display:table;
  width: 100%;
  padding: 0;
}

.row-fluid {height: 100%; display:table-cell; vertical-align: middle;}

.centering {

  float:none;
  margin:0 auto;
}
#background{position:absolute; z-index:1; width:100%; height:100%;}
#scroller {position:absolute; width:100%; height:100%; top:0; left:0; overflow:auto; z-index:2; padding:0px 20px 20px 20px;} 
.block {padding:0px 20px 20px 20px;  }

</style>

</head>
<body> 
<div>
    <img id="background" src="rabbit.jpg" alt="" title=""> 
</div>

<div id="scroller">
                  
<center><div class="container-fluid">
    <div class="row-fluid">
    
        <div class="centering text-center">
            <textarea style='opacity:0.7;' class="form-control" rows="4" placeholder="Váš příběh či problém"></textarea>
<br>
<input style='opacity:0.7;' type="text" placeholder="Váš email" class="form-control">
<br>
<div class="pull-right"><button style='opacity:0.7;' type="button" class="btn btn-info btn-lg">Odeslat</button></div>
        </div>
    </div>
</div></center> </div>
</body>
</html>

Je to celkem ošklivý, upravovat to hodlám až to bude hotové.

Díky

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: