eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwCSS - dziwny problem z tłem (cd.)
Ilość wypowiedzi w tym wątku: 17

  • 1. Data: 2009-11-14 00:24:28
    Temat: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    Przedwcześnie zakończyłem poprzedni wątek. Mam następujący problem.
    Konstruncja strony jest taka:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    ...
    </head>
    <body>
    <div id="background">tu treść</div>
    </body>
    </html>

    Do tego style:

    html {
    margin: 0px;
    padding: 0px;
    min-height: 100%;
    height:auto;
    }

    body {
    background-image: url(../pictures/siteBackground2.png);
    background-repeat: repeat-x;
    margin: 0px;
    padding: 0px;
    min-height: 100%;
    height:auto;
    }

    #background {
    background-image: url(../pictures/siteBackground.png);
    background-position: left bottom;
    background-repeat: no-repeat;
    min-height: 100%;
    width: 100%;
    }

    Jeśli okno przeglądarki jest mniejsze niż zawartość, to tło #background
    rysuje się poprawnie: na spodzie okna przeglądarki. Gdy zwiększę wysokość
    okna to tło zastyga na wysokości ostatniego elementu strony - nie spada
    niżej. Sprawdziłem: dolna granica <body> nie przylego do dolnej granicy okna
    przeglądarki. Gdy ustawię wysokość body na 100% - to wtedy jest ok, ale źle
    zaczyna się dziać gdy zawartość strony jest wyższa niż wysokość okna. Gdy
    np. tło i spód okna wypadły w połowie wysokości zawartości strony to gdy
    zacznę przewijać stronę do dołu - backdround leci do góry wraz z treścią tej
    strony.

    Czy da się zmusić tłodo bycia zawsze w lewym dolnym rogu okna?

    W tej chwili napisałem procedurę w JS, lecz jest to chore obejście:

    function fixBackground()
    {
    var h, tmp=document.getElementsByTagName("html");

    h=tmp[0].offsetHeight;
    tmp=document.getElementsByTagName("body")
    tmp[0].style.height=h+"px";
    }

    window.onload=fixBackground;
    window.onresize=fixBackground;


  • 2. Data: 2009-11-14 10:21:20
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    Czytam swój własny post i widzę, że nieprecyzyjnie wyraziłem się. Koryguję
    więc. Chciałbym aby obrazek tła rysował się w dolnym lewym rogu okna
    przeglądarki gdy strona WWW mieści się w tym oknie. Gdy strona jest wyższa,
    to tło powinno występować na spodzie tej strony. Obrazek tła jest w DIVie
    gdyż w BODY rysuję również jakiś inny element tła (góra strony, opcja
    repeat-x).

    Chciałem osiągnąć ten efekt stosując min-height: 100%. Niestety HTML
    (IE8/FF) nie reaguje na to tak jakbym oczekiwał.


  • 3. Data: 2009-11-15 11:43:35
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: Wywrota <a...@g...com>

    On 14 Lis, 11:21, "Marek" <m...@s...interia.pl> wrote:
    > Czytam swój własny post i widzę, że nieprecyzyjnie wyraziłem się. Koryguję
    > więc. Chciałbym aby obrazek tła rysował się w dolnym lewym rogu okna
    > przeglądarki gdy strona WWW mieści się w tym oknie. Gdy strona jest wyższa,
    > to tło powinno występować na spodzie tej strony. Obrazek tła jest w DIVie
    > gdyż w BODY rysuję również jakiś inny element tła (góra strony, opcja
    > repeat-x).
    >
    > Chciałem osiągnąć ten efekt stosując min-height: 100%. Niestety HTML
    > (IE8/FF) nie reaguje na to tak jakbym oczekiwał.

    A ja spróbowałem dać zamiast
    #background dać html

    przypisałem te wszystkie style do <html> czasem się tak robi...
    i powstało:

    html {
    background-image: url(../pictures/siteBackground.png);
    background-position: left bottom;
    background-repeat: no-repeat;
    min-height: 100%;
    width: 100%;
    }

    W Firefox 3.5.5 i Internet explorer 8.0 działa w innych nie
    testowałem, może to także chory pomysł ale działa ;)


  • 4. Data: 2009-11-15 14:30:10
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    >A ja spróbowałem dać zamiast
    >#background dać html

    A drugi background do <body> ? Od tego zaczynałem. Niczego to nie zmieniło.
    Okazuje się, że <body> mimo ustawienia min-height na 100% kończy się tam
    gdzie zawartość strony.


  • 5. Data: 2009-11-15 14:53:29
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    Właśnie powróciłem do wersji z body i mam obserwacje. Drugie tło (to z
    sekcji <body>) zawsze rysuje się tam gdzie wypada spód dokumentu. Jeśli
    dokument jest niższy od wysokości okna przeglądarki, to tło rysuje się
    powyżej krawędzi okna. Nie działa min-height: 100% przypisane do body.


  • 6. Data: 2009-11-15 16:29:00
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: Wywrota <a...@g...com>

    Racja napisałem ale nie sprawdziłem przy małej zawartości ;)
    ale udało mi się teraz
    struktura htm (bez zmian) natomiast arkusz styli:

    html {
    margin: 0px;
    padding: 0px;
    min-height: 100%;
    height:auto;

    }

    body {
    background-image: url(../pictures/siteBackground.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    margin: 0px;
    padding: 0px;
    min-height: 100%;
    height:auto;

    }

    #background {
    background-image: url(../pictures/siteBackground2.png);
    background-repeat: repeat-x;
    min-height: 100%;
    width: 100%;

    }

    A jak to działa ? Działa ponieważ body ma zawsze height: 100%; to
    umieszczamy ten symbol czy coś tam na dole w <body>(background-
    position: left bottom;) a skoro nasz <div> zawsze będzie zaczynał się
    u samiutkiej górnej krawędzi strony to umieszczamy w nim tło z
    powtarzaniem poziomym (background-repeat: repeat-x;) i gotowe ;) Myślę
    że to chciałeś uzyskać

    Pozdrawiam Wywrota


  • 7. Data: 2009-11-15 22:44:54
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    Odwróciłeś przypisanie - bardzo sprytne :-)
    Jest tylko mały problem. Jeśli okno jest na tyle małe, że oba tła najdą na
    siebie to to z lewego dolnego rogu wejdzie pod górne. Tymczasem ma to być
    niestety odwrotnie.


  • 8. Data: 2009-11-15 22:46:19
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: "Marek" <m...@s...interia.pl>

    Odwróciłeś przypisanie - bardzo sprytne :-)
    Jest tylko mały problem. Jeśli okno jest na tyle małe, że oba tła najdą na
    siebie to to z lewego dolnego rogu wejdzie pod górne. Tymczasem ma to być
    niestety odwrotnie.

    Czy mogę Ci wysłać na email adres strony? Nie chcę go publikować. Sądzę, ze
    ułatwi nam to sprawę.


  • 9. Data: 2009-11-15 22:55:44
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: Katarzyna 'Bastet' Świderska <b...@C...wp.pl>

    Marek pisze:
    > Odwróciłeś przypisanie - bardzo sprytne :-)
    > Jest tylko mały problem. Jeśli okno jest na tyle małe, że oba tła najdą na
    > siebie to to z lewego dolnego rogu wejdzie pod górne. Tymczasem ma to być
    > niestety odwrotnie.

    Dlaczego powtarzalnego tła nie przypiszesz do html zamiast
    body/dodatkowego diva?

    --
    Bastet_Milo


  • 10. Data: 2009-11-16 15:44:13
    Temat: Re: CSS - dziwny problem z tłem (cd.)
    Od: Wywrota <a...@g...com>

    On 15 Lis, 23:46, "Marek" <m...@s...interia.pl> wrote:
    > Odwróciłeś przypisanie - bardzo sprytne :-)
    > Jest tylko mały problem. Jeśli okno jest na tyle małe, że oba tła najdą na
    > siebie to to z lewego dolnego rogu wejdzie pod górne. Tymczasem ma to być
    > niestety odwrotnie.
    >
    > Czy mogę Ci wysłać na email adres strony? Nie chcę go publikować. Sądzę, ze
    > ułatwi nam to sprawę.

    Nie ma problemu napisz na email myślę że nie będziesz taki upierdliwi
    jak czasem ludzie bywają ;) Pisz smiało, czekam

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: