스킨만들기 놀이
Trackback to :: veilry 스킨의 비밀
여자친구 블로그에 스킨을 만들었다. 자기가 만들었던 기획상품전 카탈로그를 가지고 만든..

이번에야말로 table 태그를 안쓰고 만들어보겠다 하는 목표로 (참 쓸데없다-_-) 만들었는데 table 태그가 꼭 필요한 곳이 있다. 제목은 왼쪽 끝으로, 날짜는 오른쪽 끝으로 정렬하는 경우에는 두칸짜리 표를 만들어서 각각 내용을 넣어주면 되는데 이걸 div로 하려면 display 스타일 속성을 inline으로 주어야 하고 파이어폭스에서는 inline 박스의 width를 무시해버린다. 그래서 브라우저에 상관없이 완전히 동일한 페이지 만들기.. 에는 실패해버렸다 orz
전체적으로 큰 박스를 하나 만들고 그 안에 메뉴부분과 본문부분의 두 박스를 float: left 속성을 줘서 붙여놨다. 파이어폭스에서는 overflow: auto 속성을 주지 않거나 마진을 적게 주면 박스 일부가 잘리기도 하고 제대로 보인다고 해도 가끔씩 스크롤바가 생기는 문제도 있다.
그보다 큰 문제는 두 브라우저간의 padding 개념이 상당히 다르다는 것. 그래서 차라리 padding을 사용하지 않고 안쪽 element에 margin을 주는 쪽으로 해결하는게 속편하다.


그나저나 태터 새버전이 얼른 나와야 방명록을 붙여줄터인데..;
여자친구 블로그에 스킨을 만들었다. 자기가 만들었던 기획상품전 카탈로그를 가지고 만든..
한 곳에 시선이 집중된다;;
이번에야말로 table 태그를 안쓰고 만들어보겠다 하는 목표로 (참 쓸데없다-_-) 만들었는데 table 태그가 꼭 필요한 곳이 있다. 제목은 왼쪽 끝으로, 날짜는 오른쪽 끝으로 정렬하는 경우에는 두칸짜리 표를 만들어서 각각 내용을 넣어주면 되는데 이걸 div로 하려면 display 스타일 속성을 inline으로 주어야 하고 파이어폭스에서는 inline 박스의 width를 무시해버린다. 그래서 브라우저에 상관없이 완전히 동일한 페이지 만들기.. 에는 실패해버렸다 orz
전체적으로 큰 박스를 하나 만들고 그 안에 메뉴부분과 본문부분의 두 박스를 float: left 속성을 줘서 붙여놨다. 파이어폭스에서는 overflow: auto 속성을 주지 않거나 마진을 적게 주면 박스 일부가 잘리기도 하고 제대로 보인다고 해도 가끔씩 스크롤바가 생기는 문제도 있다.
그보다 큰 문제는 두 브라우저간의 padding 개념이 상당히 다르다는 것. 그래서 차라리 padding을 사용하지 않고 안쪽 element에 margin을 주는 쪽으로 해결하는게 속편하다.
Internet Explorer
Firefox
그나저나 태터 새버전이 얼른 나와야 방명록을 붙여줄터인데..;