eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.www[CSS] padding i width
Ilość wypowiedzi w tym wątku: 5

  • 1. Data: 2009-09-18 07:19:51
    Temat: [CSS] padding i width
    Od: TornadoTN <t...@d...net.pl>

    Witam
    Napotkałem na taki problem:

    CSS:
    div {
    width:100%;
    padding-left: 200px;
    }

    HTML:
    <div>Jakiś tekst</div>

    W przeglądarkach taki kod powoduje wyjechanie div'a o 200px w lewo poza
    widoczny ekran i pojawienie się dolnego scrolla.

    Aby pozbyć się problemu wyciąłem wpis "width:100%;" i poskutkowało.
    Natomiast pojawił się problem w Firefox 3.5 a w IE <7 problem pozostał.

    Firefox bez "width:100%" nie rozciąga div'a na całą szerokośc tylko
    dopasowuje go do szerokości tekstu. Jak się pozbyć tego efektu ?

    Dodam, że "margin" zachowuje się dokładnie tak samo jak padding co jest
    dziwne, gdyż padding to wewnętrzny odstęp i powinien się zachowywać
    inaczej niż "margin".

    Chcę osiągnąć efekt taki aby tekst był przesunięty od lewej krawędzi o
    200px i skalował się razem z oknem przeglądarki.

    Rozwiązanie na tabelach:
    <table style="width:100%" cellpading="0" cellspacing="0">
    <tr>
    <td style="width:200px;">&nbsp;</td>
    <td style=""width: auto;>Jakiś tekst</td>
    </tr>
    </table>


    Jak to zrobić na divach ?

    Pozdrawiam
    TornadoTN


  • 2. Data: 2009-09-18 08:40:24
    Temat: Re: [CSS] padding i width
    Od: alianora <a...@g...pl>

    TornadoTN pisze:
    > Firefox bez "width:100%" nie rozciąga div'a na całą szerokośc tylko
    > dopasowuje go do szerokości tekstu. Jak się pozbyć tego efektu ?

    DIV to element blokowy i (chyba?) każda przeglądarka (FF na 100%)
    domyślnie rozciąga taki element na całą dostępną szerokość (kontenera
    czy okna). Jeżeli dzieje się inaczej to pewnie masz tam ustawiony jakiś
    float.

    Próbowałeś zastąpić padding marginem?


  • 3. Data: 2009-09-19 06:04:35
    Temat: Re: [CSS] padding i width
    Od: TornadoTN <t...@d...net.pl>

    alianora pisze:
    > TornadoTN pisze:
    >> Firefox bez "width:100%" nie rozciąga div'a na całą szerokośc tylko
    >> dopasowuje go do szerokości tekstu. Jak się pozbyć tego efektu ?
    >
    > DIV to element blokowy i (chyba?) każda przeglądarka (FF na 100%)
    > domyślnie rozciąga taki element na całą dostępną szerokość (kontenera
    > czy okna). Jeżeli dzieje się inaczej to pewnie masz tam ustawiony jakiś
    > float.
    >
    > Próbowałeś zastąpić padding marginem?

    Próbowałem zastąpić i efekt jest taki sam. Masz racje ze kazda
    przegladarka rozciaga na 100%. Tylko czemu recznie wpisanie 100% daje
    inny efekt niz nie wpisanie go wcale? (oczywiscie przy uzyciu padding
    lub margin)

    FF daje ten efekt zmniejszenia diva tylko jest jest padding lub margin
    ustawione dla DIV.

    Pozdr
    Tomek


  • 4. Data: 2009-09-19 08:44:47
    Temat: Re: [CSS] padding i width
    Od: olo <o...@n...com>

    TornadoTN pisze:
    > Próbowałem zastąpić i efekt jest taki sam. Masz racje ze kazda
    > przegladarka rozciaga na 100%. Tylko czemu recznie wpisanie 100% daje
    > inny efekt niz nie wpisanie go wcale? (oczywiscie przy uzyciu padding
    > lub margin)
    >

    bo 100% oznacza szerokość równą szerokości elementu nadrzędnego
    (rodzica). A to co innego niż width: auto (domyślnie dla elementów
    blokowych). Popatrz na box model i myślę, że zrozumiesz :)

    http://kurs.browsehappy.pl/CSS/BoxModel

    --
    pozdrawiam!

    http://webtrunki.pl - piwa, wina, wódki, domowe wyroby
    ZAPRASZAMY!!


  • 5. Data: 2009-09-20 08:14:49
    Temat: Re: [CSS] padding i width - rozwiazanie
    Od: TornadoTN <t...@d...net.pl>

    Zrobiłem tak:

    div {
    position: absolute;
    left: 300px;
    right:60px;
    width:auto;
    }

    HTML:
    <div>Jakis tekst</div>

    Wreszcie dziala tak jak oczekiwalem, ale dla IE6 trzeba bedzie
    pokombinowac jeszcze :(

    Pozdr
    Tomek

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: