Stránka 1 z 1

[CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 6. 1. 2013 12:54
od PiranhaGreg
Jednoduchý dotaz. Potřebuji, aby se mi nějaký absolutně pozicovaný element roztahoval na výšku přes celou stránku. Jak na to? Mohl bych to udělat přes javascript, ale abych věděl do budoucna :-) .

Takhle se mi roztahuje jen na výšku okna browseru...
Kód: Vybrat vše
<html>
    <head>
      <title>Example</title>
        <style>
           #longElement
         {
            position: absolute;
            left: 300px;
            height: 1000px;
            width: 400px;
            background-color: red;
         }
         
         #topToBottomElement
         {
            position: absolute;
            background-color: black;
            height: 100%;
            width: 100px;
         }
        </style>
    </head>
    <body>
       <div id="longElement"></div>
      <div id="topToBottomElement"></div>
    </body>
</html>

Re: [CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 6. 1. 2013 12:56
od karlos00x
co je cilem cviceni? je to pozadi pres celou stranku nebo tam ma byt i nejaky obsah?

Re: [CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 6. 1. 2013 13:10
od PiranhaGreg
Je tam i obsah... tlačítka co přepínají tu tabulku vlevo.

Re: [CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 6. 1. 2013 15:52
od x-rated
jestli to dobře chápu, de o ten černej proužek vlevo - ten má bejt vždycky odshora až dolu, že? bych to asi udělal přes position fixed s vejškou 100%, to by mohlo fungovat...

Re: [CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 7. 1. 2013 01:55
od gandor
Potrebujes dat parentovy position:relative, aby pocitalo vysku od toho parenta (a nie od window, ktory ma vysku len viditelnej casti).

Kód: Vybrat vše
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Test position absolute + 100% vyska</title>
  </head>
  <body>
    <div style="height:850px;border:3px solid black;position:relative;width:200px">
       <div style="position:absolute;height:100%;width:50px;background:red;left:0;top:0;">aaa</div>
    </div>
  </body>
</html>


PS. Position fixed sice bude fungovat, ale roby nieco ine...

Re: [CSS] Výška elementu přes celou stránku

Odeslat příspěvekNapsal: 20. 2. 2013 13:26
od NefroniK
Skús to dať pred koniec body, a CSS takto:
position: absolute; top: 0; left: 0; bottom: 0; width: 80px;