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

Nie działająca poprawnie szerokość body

Aruba Cloud VPS - 50% taniej przez 3 miesiące!
0 głosów
404 wizyt
pytanie zadane 7 października 2018 w HTML i CSS przez bartekDSAXN Użytkownik (560 p.)

Edit: lepiej to zobaczyć w kodzie lokalnie, bo na jsfidle jest żleto widać

Cześć.. jest problem.

chodzi o to że footer przy wyglądzie responsywnym np. 345x510 , nie jest w prawym dolnym rogu, a przy końcu elementu poprzedniego, jeśli szerokość okna jest większa, wszystko działa, usunięcie bottom sprawia, że wyświetla się prawidłowo, ale nie wiem dlaczego --->

i jeszcze jedno chyba bardzo powiązane, pytanie <nav class="nav-main-mobile">…</nav> ma właściwość width 100%, a rodzic <body> ma nie określoną  ( i jest to chyba min.szerokość okna, czyli jeśli mam okno 345x510 to będzie to 345px, natomiast, w podglądzie widze że body zawiera dużo więcej w prawo, zawiera wszystko, ale nie jest to wliczone do width, bo jak widać element <nav> ma tylko szerokość okna.I teraz nie wiem co jest grane, dlaczego tak jest? i jak zrobić aby tak nie było.

https://jsfiddle.net/j9ed85fb/1/

 

1 odpowiedź

0 głosów
odpowiedź 7 października 2018 przez imklau Nałogowiec (42,090 p.)

1. Gdzie ta stopka w takim razie powinna być? Właściwie nawet bez odpowiedzi na to pytanie podejrzewam, że w ogóle nie powinna być pozycjonowana absolutnie. Bo po co?

2. Body będzie miało taką szerokość, jaką ma zawartość. Ty masz tam np .main-content, które ma min-width: 1200px i to ono Ci rozszerza body.

komentarz 7 października 2018 przez bartekDSAXN Użytkownik (560 p.)
edycja 7 października 2018 przez bartekDSAXN
wiem, wiem, div i text-align: right, ale nie o to chodzi, nie czujesz że nie o to chodzi? 0_o

po za tym, tam bedzie inny contetnt, więc .... musi być absolute, ale jeszcze go nie ma

no ma min-width 1200px, więc o co chodzi? w poglądzie body, wszystko jest ok, ma w sobie całość, przecież content ma ponad 345px, natomiast box-model pokazuje że width: 345px.
komentarz 8 października 2018 przez imklau Nałogowiec (42,090 p.)

Wiem o co chodzi i wiem, że stopka nie powinna być pozycjonowana absolutnie, no chyba, że chcesz żeby nachodziła na inne elementy :)
Masz świadomość tego, że element mający absolute jest pozycjonowany względem jakiegoś innego, który ma pozycjonowanie inne niż statyczne? A jeśli jego "przodek" takiego nie ma to wtedy jest pozycjonowany względem okna przeglądarki, czyli u Ciebie jest idealnie tak, jak sobie zapisałeś w CSS. Stopka nie jest na samym dole body, a na samym dole okna. Czujesz, że o to chodzi? 0_o

Weź to proszę na logikę, zapomnij o CSS.
Do garażu o długości 5m wejdzie merc mający 5,5m? Bo to chyba normalne, że będzie mu tyłek z garażu wystawał, nie? :D

A teraz CSS. Twoja zawartość ma minimum 1200px, więc na każdej mniejszej rozdzielczości będzie wystawać ileś tam poza body.
Masz szerokości ekranu 520px, a jakaś część strony ma ustalone na sztywno, że ma mieć nie mniej niż 1200px to myślisz, że mimo wszystko się dopasuje do 520px? Usuń sobie tymczasowo ten napis i zobaczysz o co chodzi :)

komentarz 8 października 2018 przez bartekDSAXN Użytkownik (560 p.)
no jest pozycjonowany do body, więc powinien być w prawym dolnym rogu body.

ale określiłem że <body> ma co najmniej 1200px, więc nie rozumiem o co chodzi. Czyli body powinno mieć 1200px, no i na poglądzie tak ma, a nie w wartości, no co z tego że będzie wystawał poza ekran urządzenia, od tego są scrolle, nie no nie rozumiem, przecież szerokość body to 1200px i contetnu w środku też, więc nie wiem dlaczego szerokość body to tylko szerokość ekranu, to bez sensu.
komentarz 8 października 2018 przez imklau Nałogowiec (42,090 p.)

No to niby, jak przeglądarce powiedziałeś, że chcesz mieć stopkę pozycjonowaną względem body? :D bo to, że dałeś absolute na stopkę to za mało.

W Twoim kodzie nigdzie nie ma określone, że body ma minimum 1200px. A nawet jeśli by było to byłby błąd :)

no co z tego że będzie wystawał poza ekran urządzenia, od tego są scrolle

raczej na tym nie polega responsywność, ale co ja tam wiem...

komentarz 8 października 2018 przez bartekDSAXN Użytkownik (560 p.)
edycja 8 października 2018 przez bartekDSAXN
nie chodzi o responsywność, dlaczego body na podglądzie zawiera wszystko, a i tak jego szerokość to szerokość okna urządzenia. Min 1200px; dlaczego to jest bląd? w jakim sensie.
komentarz 8 października 2018 przez imklau Nałogowiec (42,090 p.)
Czuje się jakbym mówiła do ściany :D

może ktoś inny będzie miał więcej cierpliwości....
komentarz 8 października 2018 przez bartekDSAXN Użytkownik (560 p.)
jak nie odpowiedziałeś, wtf? body jest mniejsze niż jego content, i nie odpwiedziałeś na to?
komentarz 8 października 2018 przez imklau Nałogowiec (42,090 p.)
jestem kobietą, więc wypadałoby stosować odpowiednie końcówki - to po pierwsze :)

A po drugie skoro jakiś element w body ma ustawione min-width na 1200px to  n i g d y nie będzie ta strona działać dobrze na mobile. Myślę, że temat zamknięty :)
komentarz 8 października 2018 przez bartekDSAXN Użytkownik (560 p.)
dobra, pomyliły mi się nazyw, miało być fixed.Nauczę się w końcu tego css lepiej.

Skąd mam wiedzieć że jesteś kobietą, połowa mężczyzn ma awatary kobiet.

ale to jest tylko tymczasowe, sprawdzałem jakby działało wysietlanie całych informacji z dangeo posta, ale i tak to był tylko test!!! ahahaah arrrrr.. Myślisz myślisz, a mnie to irytuje.

nie wiedziałem że jeśli content wystaje ponad szerokość okna to jest nie wliczany w body, przykre.

Podobne pytania

0 głosów
1 odpowiedź 331 wizyt
pytanie zadane 6 października 2018 w HTML i CSS przez bartekDSAXN Użytkownik (560 p.)
0 głosów
3 odpowiedzi 565 wizyt
pytanie zadane 18 grudnia 2015 w HTML i CSS przez lukasz23 Nowicjusz (120 p.)
0 głosów
1 odpowiedź 186 wizyt
pytanie zadane 27 listopada 2016 w HTML i CSS przez redstar1 Bywalec (2,200 p.)

93,096 zapytań

142,059 odpowiedzi

321,513 komentarzy

62,441 pasjonatów

Motyw:

Akcja Pajacyk

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

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...