eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwCSS - jak ustawić wysokość body na 100% ?
Ilość wypowiedzi w tym wątku: 19

  • 11. Data: 2010-07-27 09:19:56
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: sim_co <s...@g...pl>

    Marek pisze:
    > Dnia Mon, 26 Jul 2010 15:17:49 +0200, sim_co napisał(a):
    >
    > Hej,
    >
    >> Uwierz na słowo, że bawienie się ze 100% wysokości minimalną jest dość
    >> irytujące. Ja parę lat temu to zarzuciłem i po prostu ustawiam
    >> min-height dla kontenera z 'treścią' strony.
    >
    > Może nieco myśl rozwinąć? Coś źle interpretuję bo widzę w w/w sprzeczność.
    > Z jednej strony piszesz, że zarzuciłeś bawienie się ze 100% wysokością a
    > potem piszesz, że min-height ustawiasz dla kontenera - czyli w domyśle 100%
    > wysokość. Więc jednak nie zarzuciłeś :-)

    Więc zarzuciłem - taką konstrukcję stosowałem parę lat temu. Zmień
    'ustawiam' na 'ustawiałem' :)


    >> Na to co chcesz uzyskać jest następujący sposób:
    >>
    >> html,body,#glowny_kontener {
    >> position:relative;
    >> height:auto !important;
    >> min-height: 100%;
    >> height:100%;
    >> }
    >
    > Ten "mój" sposób funkcjonuje choć nie wiem czy nie jest absurdalny. Z
    > jednej strony definiuję (i Ty również), że height:100% dla <html> co
    > narzuca wysokość okna elementowi (a nie wysokość dokumentu, który może być
    > w końcu wyższy niż 100% okna przeglądarki) a z drugiej pozwalam na
    > rozciąganie <body> poprzez min-height:100%, co nie powinno pozwolić i tak
    > rozciągnąć go poza ograniczony do 100% obszar <html>. Prawda? Tworzy się
    > absurd ... ale działa.

    Absurd wynika z różnorodności w interpretowaniu css-a przez
    przeglądarki. Być może w tym momencie można stosować mniej 'absurdalne'
    konstrukcje - kiedy ja stosowałem, to były czasy IE6, IE7, FF 1.5, Opery 8


    > A co to za konstrukcja używająca 2x height? Jaki ma cel łączenie height i
    > min-height? Czy mimo, że height jest ustawione na 100% to min-height
    > pozwala aby height mogło być wyższe niż zadeklarowane?

    To taka konstrukcja, która powoduje, żeby np w IE6 wyglądało tak jak
    sobie życzysz.

    IE6 niepoprawnie interpretuje min-height, a właściwie nie interpretuje.
    Żeby mieć element na 100% wysokości musisz dać dla IE6 height:100% -
    mimo 'sztywnej' wysokości IE6 rozszerzy kontener wraz z ilością
    kontentu. Z kolei FF, O przy sztywnej wysokości nie rozszerzy kontenera
    i dlatego potrzeba dać height:auto !important - żeby nadpisało sztywne
    'height' i min-height:100%; żeby ustawiło minimalną wysokość na 100%.


    >> Możesz to rozbić na 2 arkusze styli - w głównym dajesz min-height, a dla
    >> ie6, ie7 dajesz height - ie8 z tego co wiem poprawnie interpretuje
    >> min-height.
    >
    > Tak, poprawnie.
    >
    >> Irytacja zaczyna się w momencie kiedy stopkę masz zpozycjonowaną
    >> absolutnie na dole głównego kontenera. Wiem, że pod IE6 i IE7 były
    >> czasem takie jaja, że stopka, mimo że miała
    >> {position:absolute;bottom:0;}, to 'zatrzymywała się' gdzieś po środku.
    >> Nie znalazłem rozwiązania tego. Można pewnie js-em po załadowaniu strony
    >> jeszcze raz dać mu bottom:0 ...
    >
    > W projekcie o jakim wspominam nie stosuję stopki więc mam większą swobodę w
    > doborze atrybutów CSS. Zależy mi tylko aby móc absolutnie spozycjonowany
    > DIV rozciągnąć na 100% powierzchni dokumentu jaśli jest wyższy od okna lub
    > 100% powierzchni okna, jeśli dokument jest niższy. Ten DIV ma za zadanie
    > przyciemnić treść pod nim. Nie może wystąpić żaden margines pomiędzy dołem
    > dokumentu a dolną krawędzią okna przeglądarki (dla krótszych dokumentów).
    >
    > Wyjaśniłem powtórnie aby być dobrze zrozumianym.

    Hmm pewnie nie do końca zastanowiłem się nad problemem :)

    Ja w takim wypadku jak Twój użył bym jQuery. Nadał onclicki dla
    wszystkich linków z powiększeniem i tworzył div-a absolutnego z nadanymi
    width i height - chyba $(window).height() zwraca wysokość widzialnego
    pola przeglądarki, a $("body").height() powinno zwrócić wysokość
    dokumentu. Sprawdzasz co przyjmuje większą wartość i taką nadajesz
    elementowi z alphą. Pozostaje tylko stworzenie jeszcze elementu img z
    powiększeniem i wyliczenie jego pozycji na podstawie jego wymiarów i
    $(window).height(), $(window).width() żeby wycentrować.




  • 12. Data: 2010-07-27 09:44:40
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: Paweł Piskorz <n...@p...nie?>

    On 2010-07-26 22:14, Marek wrote:
    > Pech. Faktycznie. Więc "działanie" to skutek ułomnosci przeglądarek. Swoją
    > drogą to bardzo dziwny problem, że nie przewidziano możliwości "legalnego"
    > narysowania DIV'a o W=H=100% wielkości okna przeglądarki.

    position:fixed; top:0; right:0; bottom:0; left:0;


    --
    message[autor="PablO"]::after {
    content:"Pozdrawiam";
    }


  • 13. Data: 2010-07-27 18:07:49
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: Marek <b...@e...com>

    Dnia Tue, 27 Jul 2010 11:19:56 +0200, sim_co napisał(a):

    > Ja w takim wypadku jak Twój użył bym jQuery. Nadał onclicki dla
    > wszystkich linków z powiększeniem i tworzył div-a absolutnego z nadanymi
    > width i height - chyba $(window).height() zwraca wysokość widzialnego
    > pola przeglądarki, a $("body").height() powinno zwrócić wysokość
    > dokumentu. Sprawdzasz co przyjmuje większą wartość i taką nadajesz
    > elementowi z alphą. Pozostaje tylko stworzenie jeszcze elementu img z
    > powiększeniem i wyliczenie jego pozycji na podstawie jego wymiarów i
    > $(window).height(), $(window).width() żeby wycentrować.

    Mniej więcej tak robię teraz z wyjątkkiem samego tła. Założyłem błędnie, że
    CSS jest od tego aby rozciągnąć DIV'a w pionie i w poziomie na 100%. Jeśli
    się nie da, to trudno, przerzucę również i to zadanie na JS.

    Dzięki za podpowiedź :-)


  • 14. Data: 2010-07-27 18:13:48
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: Marek <b...@e...com>

    Dnia Tue, 27 Jul 2010 11:44:40 +0200, Paweł Piskorz napisał(a):

    > On 2010-07-26 22:14, Marek wrote:
    >> Pech. Faktycznie. Więc "działanie" to skutek ułomnosci przeglądarek. Swoją
    >> drogą to bardzo dziwny problem, że nie przewidziano możliwości "legalnego"
    >> narysowania DIV'a o W=H=100% wielkości okna przeglądarki.
    >
    > position:fixed; top:0; right:0; bottom:0; left:0;

    Wooow! Dzięki! :-)


  • 15. Data: 2010-07-28 07:30:53
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: Marek <b...@e...com>

    P.S.
    Zerknij na to co zasugerował mi Paweł. Czy jest to poprawne rozwiązanie pod
    względem zgodności z CSS?

    Wspominałeś o nośnikach typu wydruk (nieograniczony wymiar "okna"). W jaki
    sposób taka definicja DIV'a będzie traktowana na tych nośnikach?


  • 16. Data: 2010-07-28 07:33:40
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: sim_co <s...@g...pl>

    Marek pisze:
    > Mniej więcej tak robię teraz z wyjątkkiem samego tła. Założyłem błędnie, że
    > CSS jest od tego aby rozciągnąć DIV'a w pionie i w poziomie na 100%. Jeśli
    > się nie da, to trudno, przerzucę również i to zadanie na JS.
    >
    > Dzięki za podpowiedź :-)

    Myślę, że nie ma co się krępować przy częściowym ostylowaniu takich
    elementów dokumentu. W sumie są tworzone tylko i wyłącznie przy jakiejś
    tam akcji usera i później usuwane. Ja nadaje wymiary, ustawiam też np
    'opacity', bo wiadomo, że dla starszych IE potrzebny jest
    'filter:alpha(...)', a tutaj jQuery bierze na siebie ten problem.

    Pozdrawiam :)


  • 17. Data: 2010-07-28 07:38:59
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: sim_co <s...@g...pl>

    Marek pisze:
    > Dnia Tue, 27 Jul 2010 11:44:40 +0200, Paweł Piskorz napisał(a):
    >
    >> On 2010-07-26 22:14, Marek wrote:
    >>> Pech. Faktycznie. Więc "działanie" to skutek ułomnosci przeglądarek. Swoją
    >>> drogą to bardzo dziwny problem, że nie przewidziano możliwości "legalnego"
    >>> narysowania DIV'a o W=H=100% wielkości okna przeglądarki.
    >> position:fixed; top:0; right:0; bottom:0; left:0;
    >
    > Wooow! Dzięki! :-)

    Działa jak olejesz IE6... IE7 z tego co wiem, też ma jakiś z tym problem

    http://www.quirksmode.org/css/contents.html#t28


  • 18. Data: 2010-07-28 11:34:59
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: Marek <b...@e...com>

    Dnia Wed, 28 Jul 2010 09:38:59 +0200, sim_co napisał(a):

    >
    > Działa jak olejesz IE6... IE7 z tego co wiem, też ma jakiś z tym problem
    >
    > http://www.quirksmode.org/css/contents.html#t28

    Chyba tak właśnie postąpię. IE9 jest już prawie opublikowany. Aktualizacje
    są darmowe. Jeśli ktoś decyduje się na stosowanie archaicznych przeglądarek
    to powinien liczyć się z tym, że coraz mniej stron będzie poprawnie
    widział.


  • 19. Data: 2010-07-28 13:56:24
    Temat: Re: CSS - jak ustawić wysokość body na 100% ?
    Od: sim_co <s...@g...pl>

    Marek pisze:
    > Chyba tak właśnie postąpię. IE9 jest już prawie opublikowany. Aktualizacje
    > są darmowe. Jeśli ktoś decyduje się na stosowanie archaicznych przeglądarek
    > to powinien liczyć się z tym, że coraz mniej stron będzie poprawnie
    > widział.

    Schyłek IE6 na szczęście już widać - wg ranking.pl 4,25% userów jeszcze
    z tej wersji 'misia' korzysta.

    Generalnie to chyba korporacje, dla których 'przesiadka' na coś nowszego
    / innego stanowi dla adminów ciężką kwestię.

strony : 1 . [ 2 ]


Szukaj w grupach

Szukaj w grupach

Eksperci egospodarka.pl

1 1 1

Wpisz nazwę miasta, dla którego chcesz znaleźć jednostkę ZUS.

Wzory dokumentów

Bezpłatne wzory dokumentów i formularzy.
Wyszukaj i pobierz za darmo: