본문 바로가기

DHTML/CSS/META

SPAN 속성

부분의 태그는 크게 block 속성을 가지거나 또는 inline 속성을 지니고 있습니다. 
block 속성은 div 와 같이 한줄에 하나의 요소만 있고 주변의 요소를 강제로 줄바꿈 시키는 성질이 있습니다. 한편 inline 요소로는 span 태그와 같은 것들이 있는데 이것들은 한 줄에 여러개의 inline 요소들이 함께 어울릴 수 있습니다. 

span 태그는 inline 요소이므로 기본적으로 width 값을 갖지 않고 내부 콘텐츠의 너비가 곧 자신의 너비가 됩니다. span 태그에 width 값을 주려면 display:block 으로 span 의 기본 성질인 inline 속성값을 block 속성값으로 변경해 주면 됩니다. IE에서는 된다고 하셨지만 그것은 IE가 CSS를 잘못 렌더링 하고 있는 것입니다. 

짐작컨데 '일정한 간격으로 띄우기 위함' 이라고 하셨다면 메뉴 또는 목록은 아닌지요? 그렇다면 span 태그가 아닌 li 태그로 마크업 하시는 것이 올바른 마크업 방식 입니다. 일단 마크업을 먼저 표준에 맞게 해주시는게 좋습니다. CSS 는 나중에 고쳐도 되지만 잘못된 마크업은 대형 공사를 불러오니까요. (X)HTML 태그들의 본래 용도를 확인하신 다음 본래의 목적과 의미에 맞게, 엄격하게 마크업 하시고 CSS 코딩은 나중에 처리하시는 것이 웹 표준 방법론 입니다.