Nie mogę dodać koloru do wszystkich divów

0

Hej,

Jako, że jestem nowy w tworzeniu stron to pytanie pewnie będzie banalne. Ale kto pyta ten nie błądzi.

Mam taka klasę

.full-page-except-header-and-footer
{
    max-width: 1200px;
    margin: 0 auto;
    background-color: rgba(255, 255, 0, 0.87);
}

Chcę, aby ten kolor był dla wszystkich innych divów zawartych właśnie w tym divie z klasą. Dlaczego tak się dzieje, że gdy ustawiam kolor tła dla całego "kontenera" to wewnątrz nic się nie zmienia? Ba w ogóle nie widać na stronie tego koloru.

2

to zasadniczo powinno działać, chyba, że robisz w bootstrapie i inne style nadają swój kolor, ew. dodaj !important testowo i zoba jak jest, a tak offline to za długie klasy tworzysz, poczytaj też o camelCase

0

Wciąż nic.
Przeglądałem wiele źródeł stron różnych blogerów programowania i większość też tak nazywa swoje klasy.
Teoretycznie powinno zadziałać, ale nic się nie dzieje, ale gdy nadaje kolor body to jest ok. Niestety to nie to co chcialbym uzyskac
Bootstrapa na razie nie ruszam.

0

jak działa na body to pewnie masz nieprawidłowo zrobionego grida, containery, rowy itp. dosyć częsty błąd początkujących...

0

Chcę, aby ten kolor był dla wszystkich innych divów zawartych właśnie w tym divie z klasą. Dlaczego tak się dzieje, że gdy ustawiam kolor tła dla całego "kontenera" to wewnątrz nic się nie zmienia? Ba w ogóle nie widać na stronie tego koloru.
(...)
Teoretycznie powinno zadziałać, ale nic się nie dzieje, ale gdy nadaje kolor body to jest ok. Niestety to nie to co chcialbym uzyskac

Podaj więcej kodu. Najlepiej cały, i najlepiej w JSFiddle. Wtedy będzie można dojść, co i jak działa.

0

Wzmiankowany element <div> kolor ma dobry, ale za to po prostu się nie wyświetla w aktualnym układzie elementów, bo jego dziecko <article> ma ustawioną własność float. Domniemywam, że ten <div> ma przez to szerokość 0. Usuń własność float i będzie go widać – aczkolwiek nie wiem, czy jej usunięcie nie zepsuje elementu <article>; no, ale nie wiem, co chcesz przez nią uzyskać.

Gdybym miał coś radzić: uważnie stosuj własność float. Może lepiej zastosować układ flexbox lub grid?

0

Float to wyjątkowo przydatny, ale dla wielu, zwłaszcza początkujących mocno nieintuicyjnie zachowujący się parametr. W 'normal flow' dokumentu, gdzie nie masz wyfloatowanych elementów, jeśli blok Y zawiera się w bloku X to blok X automatycznie dostaje wysokość, aby zawrzeć blok Y, a każdy sąsiadujący element blokowy będący następnikiem bloku Y jest renderowany pod nim. Jeśli dzieci zaczynasz floatować to wypadają one ze standardowego procesu budowania dokumentu w którym pionowa granica gdzie powinien trafić kolejny element czy gdzie się kończy element nadrzędny nie jest przesuwana. Jednym słowem floatowane elementy nie budują wysokości elementu nadrzędnego póki ręcznie nie wyczyścisz floata (parametr 'clear') Dlatego kiedyś często po elementach flotowanych stosowało się pusty element z 'clearem' przed zamknięciem elementu nadrzędnego. Teraz w większości wypadków stosowane jest poniższe rozwiązanie:


.full-page-except-header-and-footer::after {
  content: "";
  display: table;
  clear: both;
}

1 użytkowników online, w tym zalogowanych: 0, gości: 1