Firefox i Chrome inaczej wyswietlają container-fluid

0

Właśnie testowałem jedną stronę kiedy wyszło na to, że FF i Chrome inaczej wyświetlają ten sam kod w symulowanym trybie mobile. Chodzi konkretnie o container fluid. Stronę tworzyłem na FF i w FF jest to wycentrowane jak trzeba. Natomiast w Chrome nie. Jest to dość łatwe do naprawienia dla chrome, wystarczy w pliku bootstrap.css ustawićpadding-right:0
zamiast
padding right:15px.
Tyle, że wtedy zmienia się od razu wygląd w FF. Na pewno ktoś już wszedł na tego babola, jak do tego podejść?
Gdyby ktoś chciał rzucić okiem jak to wygląda, zapraszam. https://kiszuriwalilibori.netlify.com/

2

Musisz mieć błąd w swoim kodzie, to nie jest problem bootstrapa, sama biblioteka jest robiona tak, ze wszędzie wszystko działa tak samo. Takie błedy wynikają z innych błedów najczęściej w html lub poprzez nadpisywanie stylów boostrapa.

2

Na początek zoba to:
https://validator.w3.org/nu/?doc=https%3A%2F%2Fkiszuriwalilibori.netlify.com%2F
posprawdzaj
ew. potem pogadamy

0

czysteskarpety napisał(a):

Na początek zoba to:
https://validator.w3.org/nu/?doc=https%3A%2F%2Fkiszuriwalilibori.netlify.com%2F
posprawdzaj
ew. potem pogadamy

Taaa... jest co porobić. Tylko jedno ale. Przez ciekawość spojrzałem na trzy inne moje strony robione zupełnie niezależnie i kiedy indziej i jest dokładnie ten sam mankament. Stąd postawiłem wątek.

0

mr_jaro napisał(a):

Musisz mieć błąd w swoim kodzie, to nie jest problem bootstrapa, sama biblioteka jest robiona tak, ze wszędzie wszystko działa tak samo. Takie błedy wynikają z innych błędów najczęściej w html lub poprzez nadpisywanie stylów boostrapa.

Jasne. W takim razie pytanie, żebym dobrze zrozumiał konkluzję. Jeżeli linkuję bootstrapa i style własne w sekcji head strony, style bootstrapa są zawsze na dole czyli jako ważniejsze? O to się z grubsza rozchodzi (to trywializacja oczywiście)? W plikach bootstrapa nie majstruję. Natomiast niewątpliwie moje klasy gdzieś tam się z nimi nakładają. Z drugiej strony przejrzałem dokładnie i nie znalazłem na pierwszy rzut oka nic co by wyglądało na źródło asymetrii.

Natomiast nie do końca podzielam przekonanie, że taki efekt nie może wystąpić przy poprawnej stronie. Z zupełnie innej beczki, całkiem niedawno zauważyłem (właściwie: doedukował mnie stackoverflow - że Chrome inaczej interpretuje target; w skrócie, żeby być bezpiecznym należy pisać currentTarget). Ale to było po 3 godzinach przewracania kodu na wszystkie strony. Stąd ten wątek, może ktoś przez coś podobnego przechodził

1

nie. style powinny być ładowane w ten sposób:

resety
biblioteki
własne style

Na pierwszy rzut oka możesz nie znaleźć. Nie jest to nic dziwnego. Takie bugi potrafią zajmować i 10h, gdzie w pewnym momencie zaczynasz po prostu ponownie składać kod aż wychodzi, że nagle w tym konkretnym momencie się zaczyna dziać szukany niepożądany efekt.

1

Kiszuriwalilibori napisał(a):

FF i Chrome inaczej wyświetlają ten sam kod w symulowanym trybie mobile. Chodzi konkretnie o container fluid.

Na czym polega ta inność? Bo u siebie nie widzę różnicy.

0

Freja Draco napisał(a):

Kiszuriwalilibori napisał(a):

FF i Chrome inaczej wyświetlają ten sam kod w symulowanym trybie mobile. Chodzi konkretnie o container fluid.

Na czym polega ta inność? Bo u siebie nie widzę różnicy.
Otwórz w Chrome i zasymuluj mobile. Zawartość nie jest wycentrowana, ucieka w prawo o 15px

1

Kiszuriwalilibori napisał(a):

Na czym polega ta inność? Bo u siebie nie widzę różnicy.
Otwórz w Chrome i zasymuluj mobile. Zawartość nie jest wycentrowana, ucieka w prawo o 15px

Możem ślepa, ale u siebie niczego takiego nie widzę:

0

Kiszuriwalilibori napisał(a):

czysteskarpety napisał(a):

Na początek zoba to:
https://validator.w3.org/nu/?doc=https%3A%2F%2Fkiszuriwalilibori.netlify.com%2F
posprawdzaj
ew. potem pogadamy

Taaa... jest co porobić. Tylko jedno ale. Przez ciekawość spojrzałem na trzy inne moje strony robione zupełnie niezależnie i kiedy indziej i jest dokładnie ten sam mankament. Stąd postawiłem wątek.

Freja Draco napisał(a):

Kiszuriwalilibori napisał(a):

Na czym polega ta inność? Bo u siebie nie widzę różnicy.
Otwórz w Chrome i zasymuluj mobile. Zawartość nie jest wycentrowana, ucieka w prawo o 15px

Możem ślepa, ale u siebie niczego takiego nie widzę:

Robisz to W Chrome na rzeczywistej komórce??? Pytam bo ja patrzę na symulator i mam przesunięcie

0

Kiszuriwalilibori napisał(a):

Robisz to W Chrome na rzeczywistej komórce??? Pytam bo ja patrzę na symulator i mam przesunięcie

Naleśnik / Więcej narzędzi / Narzędzia dla programistów
Toggle device mode
a w opcjach: user agent type - mobile (default)

Jest tam jeszcze jakiś inny emulator?

Ale to stary Chrome jest i może działa inaczej niż nowsze, ale to nakazuje rozważyć możliwość, iż może błąd leży po stronie samego emulatora. Sugeruję zobaczyć najpierw, jak to wygląda w prawdziwym telefonie, zanim zaczniesz poprawiać.

0

Dzięki Freja, dzięki wszystkim. odpaliłem na Chrome w rzeczywistej komórce i jest OK. Temat do zamknięcia

1

Przy okazji polecam np: https://www.browserling.com to prawdziwe emulatory, bo te tryby mobilne z przeglądarek to tylko takie przybliżenie, które co prawda jest pomocne, ale czasem jednak potrafi coś przekłamywać przy bardziej pokręconych konstrukcjach.