eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwCSS - rebus
Ilość wypowiedzi w tym wątku: 7

  • 1. Data: 2012-12-09 12:53:57
    Temat: CSS - rebus
    Od: Marek <p...@s...com>

    Mam taki problem. Mamy pasek nawigacyjny:

    <nav>
    <div>...</div>
    <div class="selected">...</div>
    <div>...</div>
    ...
    </nav>

    Jedna z opcji menu jest wyselekcjonowana. Graficznie ma się ona wysunąć
    do góry, ponad obrys NAV i zajmować wysokość NAV + 20px. Jednakże
    zawartość DIVa ma pozostać na miejscu. Problem polega na tym, że jeśli
    zwiększy się wysokość wyselekcjonowanego DIVa o 20px, to wszystkie
    pozostałe przesuną się w dół jako inline-bloki. Chyba zmęczenie mnie
    dopadło bo nie wiem jak z tego wybrnąć.

    nav {
    position-relative;
    height: 100px;
    width: 900px;
    }

    div {
    position-relative;
    display: inline-block;
    height: 100px;
    background-color: #F00;
    }

    .selected {
    margin-top: -20px;
    padding-top: 20px;
    }


    CSS cytuję poglądowo. Wyrzuciłem to co nie ma związku ze sprawą.


  • 2. Data: 2012-12-09 13:29:33
    Temat: Re: CSS - rebus
    Od: Wojtek Gapiński <w...@w...I.TO.TEZ.pl>

    Dnia 09-12-2012 12:53 Marek napisał:

    > nav {
    > position-relative;
    > height: 100px;
    > width: 900px;
    > }

    Chyba: "position: relative;"? Czy o czymś nie wiem?

    --
    Wojtek Gapiński
    http://jwmprojekt.pl


  • 3. Data: 2012-12-09 14:03:07
    Temat: Re: CSS - rebus
    Od: Marek <p...@s...com>

    W dniu 2012-12-09 13:29, Wojtek Gapiński pisze:
    > Dnia 09-12-2012 12:53 Marek napisał:
    >
    >> nav {
    >> position-relative;
    >> height: 100px;
    >> width: 900px;
    >> }
    >
    > Chyba: "position: relative;"? Czy o czymś nie wiem?
    >

    Tak, masz rację. CSS zredagowałem poglądowo. Literówki mogą się zdarzyć.
    Niemniej jednak chodzi mi o meritum sprawy.


  • 4. Data: 2012-12-09 15:25:52
    Temat: Re: CSS - rebus
    Od: Wojtek Gapiński <w...@w...I.TO.TEZ.pl>

    Dnia 09-12-2012 14:03 Marek napisał:
    > W dniu 2012-12-09 13:29, Wojtek Gapiński pisze:
    >> Dnia 09-12-2012 12:53 Marek napisał:
    >>
    >>> nav {
    >>> position-relative;
    >>> height: 100px;
    >>> width: 900px;
    >>> }
    >>
    >> Chyba: "position: relative;"? Czy o czymś nie wiem?
    >>
    >
    > Tak, masz rację. CSS zredagowałem poglądowo. Literówki mogą się zdarzyć.
    > Niemniej jednak chodzi mi o meritum sprawy.

    OK, wolałem się upewnić :)
    Zostawiłeś miejsce w elemencie znajdującym się powyżej <nav> na te 20 px
    marginesu? Bo jeśli nie, to nic dziwnego, że całość przesuwa się w dół -
    jakoś trzeba zmieścić te elementy.

    pozdrawiam
    --
    Wojtek Gapiński
    http://jwmprojekt.pl


  • 5. Data: 2012-12-09 18:08:52
    Temat: Re: CSS - rebus
    Od: HARY <h...@e...invalid>

    On Sun, 09 Dec 2012 15:25:52 +0100, Wojtek Gapiński wrote:
    > Dnia 09-12-2012 14:03 Marek napisał:
    >> W dniu 2012-12-09 13:29, Wojtek Gapiński pisze:
    >>> Dnia 09-12-2012 12:53 Marek napisał:
    > Zostawiłeś miejsce w elemencie znajdującym się powyżej <nav> na te 20 px
    > marginesu? Bo jeśli nie, to nic dziwnego, że całość przesuwa się w dół -
    > jakoś trzeba zmieścić te elementy.

    No właśnie: daj im margin-top:20px, a temu, który jest "selected"
    margin-top:0 i o 20px większą wysokość.

    HARY

    --
    Acting is an art which consists of keeping the audience from
    coughing.


  • 6. Data: 2012-12-09 19:09:07
    Temat: Re: CSS - rebus
    Od: Marek <p...@s...com>

    W dniu 2012-12-09 15:25, Wojtek Gapiński pisze:

    > Zostawiłeś miejsce w elemencie znajdującym się powyżej <nav> na te 20 px
    > marginesu? Bo jeśli nie, to nic dziwnego, że całość przesuwa się w dół -
    > jakoś trzeba zmieścić te elementy.

    Nie zostawiłem. Ponadto nie powstaje przestrzeń między nav a
    poprzedzającym elementem. Element z marginesem -20px wychodzi poza nav i
    nachodzi na element poprzedzający. Problem dotyczy tego co się w nav
    dzieje.

    W międzyczasie zastosowałem vertical-align: bottom na każdym DIVie. To
    rozwiązało problem. Nie wiem dlaczego poprzednio nie chciało to
    zadziałać. Zmieniałem CSS w paru miejscach i nie jestem już w stanie
    dowiedzieć się co było źle.


  • 7. Data: 2012-12-09 19:13:12
    Temat: Re: CSS - rebus
    Od: Marek <p...@s...com>

    W dniu 2012-12-09 18:08, HARY pisze:
    > No właśnie: daj im margin-top:20px, a temu, który jest "selected"
    > margin-top:0 i o 20px większą wysokość.

    W międzyczasie rozwiązałem problem. Wojtkowi napisałem więcej o tym.

    Rozważając już akademicko: przy takim rozwiązaniu element selected nie
    wyszedłby poza obrys nav więc nie spełniłby założeń. Chodzi o to aby
    grafika wyselekcjonowanego przycisku zachodziła na grafikę powyżej nav.

strony : [ 1 ]


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: