• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

CSS -> Selektor :nth-child mi nie działa

+1 głos
35 wizyt
pytanie zadane 20 września w HTML i CSS przez Doge Bywalec (2,270 p.)

Witam, próbuję zaznaczyć parzyste i nieparzyste childy, ale coś mi nie chce działać. Chodzi mi o to, aby tekst pierwszego diva był wyrównany do lewej strony, a drugiego do prawej strony itd. Kiedy zmieniam szerokość w (even) to nic się nie dzieje, ale jak zmieniam szerokość w (odd) to zmienia się szerokość parenta. O co chodzi? Poniżej wstawiam kod

<div class="buy-field">
            Czy chcesz kupić pole pole za cena?
            <div class="field-card">
                <div>Czynsz</div> <div>cena </div>
                <div>Z 1 domem</div> <div>cena  </div>
                <div>Z 2 domami</div> <div>cena </div>
                <div>Z 3 domami</div> <div>cena  </div>
                <div>Z 4 domami</div> <div>cena </div>
                <div>Z hotelem</div> <div>cena </div>
            </div>
        </div>
.buy-field
{
    width: 50%;
    height: 50%;
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.field-card
{
    width: 60%;
    height: 85%;
    background-color: lightgreen;
    display: flex;
    flex-wrap: wrap;
}
.field-card:nth-child(even)
{
    width: 50%;
    text-align: right;
}
.field-card:nth-child(odd)
{
    width: 50%;
    text-align: left;
}

 

1 odpowiedź

+2 głosów
odpowiedź 20 września przez qax Mądrala (6,510 p.)
wybrane 20 września przez Doge
 
Najlepsza
.buy-field
{
    width: 50%;
    height: 50%;
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.field-card
{
    width: 60%;
    height: 85%;
    background-color: lightgreen;
    display: flex;
    flex-wrap: wrap;
}
.field-card div:nth-child(even)
{
    width: 50%;
    text-align: right;
}
.field-card div:nth-child(odd)
{
    width: 50%;
    text-align: left;
}

W .field-card:nth-child(odd) odwołujesz się do rodzica. Musisz użyć .field-card div:nth-child(odd) aby odwołać się do jego potomków.

Podobne pytania

0 głosów
1 odpowiedź 101 wizyt
pytanie zadane 6 czerwca 2019 w HTML i CSS przez Rozukee Początkujący (300 p.)
0 głosów
1 odpowiedź 77 wizyt
pytanie zadane 12 maja 2019 w HTML i CSS przez yato94 Nowicjusz (140 p.)
0 głosów
1 odpowiedź 64 wizyt

85,873 zapytań

134,644 odpowiedzi

298,914 komentarzy

56,739 pasjonatów

Advent of Code 2021

Top 15 użytkowników

  1. 926p. - rucin93
  2. 925p. - Whistleroosh
  3. 912p. - nidomika
  4. 876p. - adrian17
  5. 867p. - Michal Drewniak
  6. 866p. - Mikbac
  7. 863p. - Mateusz Bogdan
  8. 859p. - CC PL
  9. 797p. - Argeento
  10. 704p. - ScriptyChris
  11. 683p. - tokox
  12. 660p. - Vinox
  13. 645p. - TheLukaszNs
  14. 642p. - s. Dorota Kowalewska
  15. 601p. - Marcin Harasimowicz
Szczegóły i pełne wyniki

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...