1. 인라인 블록 요소의 상위 요소를 설정합니다.
상위 요소의 글꼴 크기를 0;으로 설정합니다. 하위 요소의 글꼴 크기를 적절한 크기로 설정합니다. 하위 요소의 글꼴 크기가 설정되지 않은 경우 하위 요소는 상위 요소의 0을 상속합니다.
2. 인라인 블록 요소의 상위 요소를 설정합니다. (letter-spacing : 글자간격)
상위 요소의 문자 간격을 -4px 또는 -8px로 설정합니다. Google을 제외하면 -8px이고 나머지는 -4px입니다. 또한 하위 요소의 문자 간격을 0으로 설정합니다. 그렇지 않으면
입니다.
상위 요소를 상속하여 하위 요소의 텍스트가 변형됩니다.
테스트 후 -8px로 설정했는데, 이것이 가능한지 모르겠습니다. 의견이 있으시면 말씀해 주세요.
3. 인라인 블록 요소의 상위 요소를 설정합니다. (단어 간격: 단어 간격)
상위 요소의 단어 간격을 -4px 또는 -8px로 설정하고, Google, 360은 -8px, Firefox, IE는 -4px로 설정합니다. 또한 하위 요소의 word-spacing: 0을 설정합니다. 그렇지 않으면 상위 요소를 상속하여 하위 요소의 텍스트가 변형됩니다.
위와 동일하게 -8px로 설정할 수도 있습니다
4. 위의 테스트는 Google, Firefox, 360 모두 최신 브라우저인 IE8에서 테스트되었습니다. 잘못된 점이 있으면 알려주시기 바랍니다.
위 내용은 편집자가 소개한 inline-block 속성으로 인해 발생하는 태그 간 간격 문제입니다. 모든 분들께 도움이 되었으면 좋겠습니다!