Pola wyboru nie pokazują Chrome - działają w innych przeglądarkach


Nie bardzo rozumiem, co się dzieje. Po lewej stronie „Zapamiętaj mnie” powinno być pole wyboru, a na dole dwa pola testowe, ponieważ mam rower, mam samochód. Pojawiają się w przeglądarce Firefox, ale nie w Chrome. Wydaje mi się, że mam problem z CSS, ale nie mogę go znaleźć? Czy ktoś może pomóc?
http://www.cloudtute.com/aut
http://www.cloudtute.com/auth
Zaproszony:
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Odpowiadam w szerszym zakresie dla tych, którzy borykają się z tym problemem checkboxów nie pojawiających się w Chrome. I zostały wysłane tutaj przez Google. Możesz również mieć ten problem w Safari, ponieważ oba obecnie używają

WebKit
https://en.wikipedia.org/wiki/WebKit
.
Napotkaliśmy ten problem na naszej własnej stronie internetowej, gdzie pola wyboru i wejścia radiowe nie były prawidłowo wyświetlane. Ale naprawiłem to, dodając to do naszego CSS.
input[type=checkbox]
{
-webkit-appearance:checkbox;
}

Teraz działa dobrze.
Jak widać, inny programista dodał
-webkit-look: none;
dokładnie tak samo, jak w twoim przypadku. W naszym przypadku to dlatego, że zacząłem od tematu.
Aby jednak mieć absolutną pewność, że dane wejściowe się pojawią, możesz po prostu zadeklarować te reguły w swoim CSS. Na tej stronie umieściłem style w tagu
& < style & >
(czego nie polecam), ale podczas testów wykonałem zrzut ekranu. Najlepszym rozwiązaniem byłoby usunięcie sprzecznych stylów i dodanie stylów do odpowiedniego folderu.
Dodatkowe zasoby:
https://css-tricks.com/almanac ... rance
https://css-tricks.com/almanac ... ance/
/
https://davidwalsh.name/webkit-appearance
https://davidwalsh.name/webkit-appearance
Co to jest WebKit i jaki ma związek z CSS?
https://coderoad.ru/3468154/
https:// developer.apple.com/library/content/documents/AppleApplications/link/SafariCSSRef/article/StandardCSSProperties.html
https://developer.apple.com/li ... .html
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Ta linia w Twoim CSS:
-webkit-appearance: none;

Reguła stylu dla
input, button, select, textarea
polega na tym, że wszystko za Ciebie.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Zdefiniowałeś regułę stylu:
-webkit-appearance: none;

zdefiniowany dla
input, button, select, textarea
, powinieneś go usunąć i zadziała.
Masz również błąd JS w konsoli:
Uncaught ReferenceError: Containerz nie jest zdefiniowany
, sprawdź to.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Jeśli nadasz polu wyboru szerokość 0 pikseli w Firefoksie, możesz to zobaczyć, ale jeśli otworzysz ten sam kod w Chrome, pole wyboru jest niewidoczne.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Usuń definicję szerokości i wysokości pola wyboru. Miałem ten sam błąd, ale zauważyłem, że już wstawiłem małą wartość dla szerokości i wysokości pola wyboru, więc usunąłem te właściwości.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Miałem ten sam problem.
Kiedy wyłączyłem rozszerzenie Ad-Block, zadziałało!
Następnie dodałem wyjątek dla tej witryny do Ad-Block.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Ustawienie wartości pola wyboru na true zadziałało dla mnie
value="true"
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Z jakiegoś dziwnego powodu usunięcie tego wiersza
height: 100%
z mojego CSS rozwiązało problem. Pole wyboru znajdowało się pod elementem
td
tabeli.
Zrobiłem więc tę zasadę, aby uniknąć tego jednego przypadku:
table td > input:not([type='checkbox']) {
height: 100%;
}
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

input[type=checkbox] {
display: block;
}

to właśnie rozwiązało mój problem

Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się