- webkit-margin dodaje niechciany margines na tekstach

Te -webkit-margin (s) są nadpisywane przez margin: 0; padding: 0;. Nie martw się o nich.

Miałem ten sam problem. Wyświetlanie poprawnie w Firefoksie, ale nie Chrome.

Przyjrzałem się bliżej http://meyerweb.com/eric/tools/css/reset / i okazało się, że nie zadeklarowałem ogólnej wysokości linii dla tagu body w moim arkuszu stylów. Ustaw go na 1.2 i to odtworzyło poprawny układ w obu przeglądarkach.

Po prostu usuń białe spacje między znacznikami np.

<p id="one"></p>
<p id="two"></p>

Staje się:

<p id="one"></p><p id="two"></p>

Miałem ten sam problem. Dodatkowa przestrzeń między łączami menu. Żadne z powyższych rozwiązań nie zadziałało. To, co działało dla mnie, to ujemny margines. Po prostu zrób coś takiego:

margin: 0 -2px;

NOWA EDYCJA:

To nie ma nic wspólnego z-webkit-margins. Najprawdopodobniej problem występuje z elementami wbudowanymi. Dzieje się tak, ponieważ między elementami wbudowanymi występują spacje lub podziały linii. Aby to naprawić, masz wiele opcji:

• usuń wszystkie spacje i podziały linii między elementy inline
• pomiń znacznik zamykający element - na przykład </li> (HTML5 nie obchodzi)
• ujemny margines (jak wspomniano powyżej-problemy z IE6/7-kogo to obchodzi, upgrade;)
• Ustaw font-size: 0; na problematyczny kontener elementu inline (ma problemy z Androidem i rozmiarem czcionki z ems)
• Zrezygnuj z inline i użyj float (w ten sposób stracisz tekst-align: center)

Wyjaśnione dokładniej i przykłady CHRIS COYIER

Miałem ten sam problem z moim tagiem <h3>. Próbowałem ustawić margin:0;, ale nie zadziałało.

Odkryłem, że zwykle komentowałem linie w moim css za pomocą //. Nigdy tego nie zauważyłam, bo wcześniej nie sprawiało to żadnych problemów. Ale kiedy użyłem // w linii przed zadeklarowaniem <h3>, spowodowało to całkowite pominięcie deklaracji przez przeglądarkę. Kiedy wymieniłem // na /**/, byłem w stanie skorygować marżę.

Morał tej historii: Zawsze używaj WŁAŚCIWEGO komentowania składnia!

Dla mnie zdjęcie było:

* {margin:0;padding:0;}

Firefox (FF) i Google Chrome umieszczają marginesy 0,67 em niezależnie. FF pokazał swój domyślny margines, ale przekreślony, ale i tak go zastosował. GC pokazało swoją domyślną marżę (- webkit-margin-before...) uncrossed.

I applied

* {margin:0;padding:0; -webkit-margin-before: 0; -webkit-margin-after: 0;}

Ale bezskutecznie, chociaż GC pokazało teraz przekroczenie domyślnego marginesu.

Dowiedziałem się, że mogę zastosować albo

line-height: 0;

Lub

font-size: 0;

Aby osiągnąć pożądany efekt. To ma sens., jeśli przyjąć, że margines jest z .Typ 67em. Gdyby ktoś mógł wyjaśnić, dlaczego przeglądarki uprzykrzają nam życie, stosując zależny od wysokości linii, nieusuwalny margines, byłbym naprawdę wdzięczny.

Dla mnie w Chrome to jakieś 40px padding-start powodowało to Zrobiłem to, co działało:

ul {
    -webkit-padding-start: 0em;
}

    -webkit-margin-before: 0em;
    -webkit-padding-start: 0;
    -webkit-margin-after: 0em;

Miałem ten sam problem. Nagle jedna z moich trzech komórek tabeli zawierających dane jej nagłówek został przesunięty trochę w dół. Mój problem został po prostu rozwiązany przez dodanie tego:

table td
{
    vertical-align: top;
}

Wygląda na to, że jakiś inny element w 'wyższym' arkuszu stylów kazał moim danym wyśrodkować się w komórce, zamiast po prostu pozostać na górze.

Myślę, że to po prostu głupie, i nie było naprawdę problemem... ale następna osoba, która przeczyta ten temat, może mieć ten sam głupi błąd, co ja:)

Take care!

Jeśli user agent stylesheet zaczyna działać, dzieje się tak dlatego, że właściwość tag nie została poprawnie zdefiniowana w arkuszu stylów css.

Są szanse, że literówka, zapomniany wspornik lub średnik rozbijają arkusz stylów przed przejściem do ustawień właściwości tagów, do których później odnosi się Strona lub"potrzeby".

Uruchom CSS poprzez sprawdzanie błędów, jak CSS LINT i napraw błędy, które zostaną ostatecznie wykryte.