저자가 컨텐츠에 직전 간단한 코멘트나 주석을 곧바로 달아주는 방식은 이미 프린트 디자인 에서는 널리 퍼진 레이아웃 방식 입니다. 제가 가끔보는 The Elements of Typographic Style 의 한 페이지 입니다. 오른쪽에 글이 있고 왼쪽에 주석이나 예제가 표시되어 있죠.

background. background. background. background-position is used to place the origin image with respect to the padding edge of the element. In other words, the image-placement context is the innner border edge, even though the background area extends to the outer border edge. 그리고, background-position: 30px; [...]

이제겨우 브라우저들이 CSS2 와 2.1 을 조금씩 신경써서 지켜가고 있는 가운데 몇몇 브라우저들에서는 몇가지 CSS3 를 해석하고 있습니다. 제생각에는 WebKit 이 가장만이 지원하는거 같더군요. 꽤 오래되긴 했지만 (신기하게 아무도 언급을 안하는) Multi Column 은 불여우에서 1.5버전부터 지원되고 있는 기능이 있구요, 이미 오래전에 CSS2, CSS2.1 에 [...]

W3C 에서 권고하는 디자인(프레젠테이션)과 문서(컨텐츠)의 분리는 많은 이득을 가지고 옵니다. 물론 반론도 있지만요 ^^;; 분리로 인해 디자인은 더욱 자유로울수 있으며 훨신 높은 유연성을 가질수 있게됩니다. 문서 또한 문서대로 의미에 맞는 태그안에 분류하여 의미를 부여하고 문서에 충실할수 잇는 효과를 불러올수 있습니다. 지난번 CSS 옷벗는날(css naked day) [...]

드디어 알아버리고 말았다. 슈퍼 울트라 ie hack 을… 알려준 Indranil 야 고맙다. 이제 ie 버그로부터 해방되자. . . . css 맨 위에 다음 코드를 삽입하면 된다. * html {display:none;}

한창 일모리가 ‘xhtml 을 구조화 하여 문서처럼 나타내는 것이다’ 라는 부분을 강조했었습니다. 그렇다면 더 나아가서 CSS 를 사용하여 스크린을 통해 보는것 뿐만이 아닌 실제로 문서처럼 html 을 전문적으로 프린트를 할수 있을까요. A List Apart 에서 그 질문을 가지고 직접 실험한것을 나누었습니다. html 파일과 css 파일을 [...]

Kevin Smith가 정리해 놓은 css 필터 차트. 이것들을 잘 참고 하시면 어느 브라우저에 이 부분이 먹히고 먹히지 않는지 알수 있습니다. 프린트 해 놓으셔도 괜찮지 않을까요 ^^; 차트보기

CSS 를 쓰는데에 대한 절대적인 방법은 없습니다. 그리고 그것이 문제가 되는것도 아닙니다. 하지만 그래도 어떠한 일관된 방식으로나 어떠한 규칙을 정해서 쓴다면 한마디로 구조적인 CSS 를 쓸수 있다면 여러모로 플러스가 되지 않을까 생각이 듭니다. 예전에 후니님께서도 이러한 고민을 하셨듯이 내가 만들지 않은 CSS를 수정하는 것이 생각보다 [...]

달삼님께서 CSS3 옅보기를 시리즈로 올리고 계시는군요. CSS 3는 처음부터 모듈을 기반으로 설계가 되었으며 아예 모듈별로 별도의 표준화가 진행 중이다. (모두 CSS 3지만 일부는 Recommendation, 일부는 Draft 등 상태가 다르다.) 물론 이외에도 다양한 문제점을 해결하고 기능 추가가 이루어 졌다. 앞으로 CSS 3 미리보기 시리즈는 이러한 추가기능들을 [...]

이번에는 A2님의 조언을 수용해서 다른 레이아웃을 단순한 CSS 만으로 바꾸어 보겠습니다. 이것은 css의 레이아웃 구조만 잘 이해하고 있다면 특별히 어려운 부분은 아니라고 봅니다. 전혀 xhtml부분은 건드리지 않았습니다. 단순히 약간의 포지셔닝을 첨부하여 바꾸었습니다.

레이아웃 시리즈를 시작하겠습니다. 레이아웃은 일단 xhtml 과 css 의 기본을 이해하고 적용하는데에 가장 접하기 쉬우면서 까다로운 부분이라 다루고 싶었습니다. 이제 점점 표준에 관한 의식도 점점 높아가면서 더 그 중요성을 느끼고 있습니다. 가장 기본적인 레이아웃으로 시작해서 많이사용되는 예들로 채워보겠습니다. xhtml 은 1.0 transitional, 그리고 css 2.0 [...]

헌데 이걸 보면 볼수록 왜 그래야 하는 이유를 점점 잃어갑니다. 후니님이 예상하신데로 2년안에 국산 테이블이 자기가 하고 싶은일 하면서 쉬고 있을까요? 새 사이트 작업중 하던중에 후니님께서 MSN 하셔서 알려주셨습니다. 감사합니다. http://www.csscripting.com/wiki/index.php?title=CSS3_Multi_Column 보통 점잖은척을 합니다만,, 이번만큼은 참을수가 없군요. 다같이 그냥 소리칩시다 >>ㅑ~~~~~~

!important 는 핵이 아닌 부분으로써 핵으로 많이 간주되고 쓰이고 있습니다. 이 important, 중요 부분은 특정한 값이 반복적으로 적용되었을 경우 어떤것에 우선순위를 주는지 정할수 있습니다. 해더의 폰트색상을 빨강으로 정해 놓고 혹시나 다른곳에서 정해줄때 바뀌지 않도록 !import 를 넣어주면 어떻게 되던간에 그 값이 지정값이 됩니다.

표준을 구연하는데에 쓰이는 해킹, 핵을 쓰는것이 CSS 이던 XHTML 부분이던 과연 좋은것인지 안좋은 것인지는 개개인의 판단과 기준에 따라서 바뀌는 부분입니다. 하지만, 아직 완벽하지 않은 표준의 태두리에서 그 태두리 안에 들어가기 위해서는 어쩔수 없는 부분일 수도 있겠습니다.

예전에 피오넬님께서 고생고생 하시면서 겪었던 문제를 이제서야 잡았습니다. 피오넬님댁의 TT 버전을 보시면 유저가 원하는 스킨을 고를수 있게 되어있지만, 원래의 스킨 말고 다른 옵션 스킨을 선택할시에, 즉 다른 css 파일을 선택할 시에 새롭게 로딩될때마다 잠시 원본스킨이 자꾸 로딩되었었습니다.

고질적인 IE의 문제 계속됩니다. 3px 의 문제 입니다. 무언가 padding 값도 잡은거 같은데 IE에서 이상하게 깨지는 경우가 있습니다. 이것은 전 포스팅에 다룬 PADDING 의 DIV 안쪽의 문제가 아닌 바깥쪽의 문제가 되는데요, FLOAT 값과 만나는 경우 입니다.