GNUNIX

티스토리(Tistory) 수정중에 티에디션의 대문을 가운데 정렬해야 할 일이 생겼다.

그래서 검색해보니...

기존에 나온 결과들은 일정 해상도에서 고정된 절대 왼쪽 여백(margin)을 주어서 설정을 하도록 되어있는것뿐.

모든 해상도에서 가운데 정렬을 하기위한 center 설정을 해주는 부분이 없었다.

그래서 해결하려고 찾아보니...

 

해당 div에 ttConvas라는 이름으로 id가 들어가있었다.

이미 수정 불가능한곳에 css가 들어가 있었지만 어떻게든 해보기로 결정!

 

 

제가 한 방법은 아래와 같습니다.

div#ttCanvas{
  margin-left:auto !important;
}

기존의 margin-left를 없애기위해서 !important를 추가하며 기존 왼쪽 여백을 무력화 시켜보았습니다.

 

처음엔 0px로 주었다가;;;; 안되어서 auto로 수정하였습니다 ^^ (참고하세요^^)

 

 

 

 

 

'Etc' 카테고리의 다른 글

정품인증  (23) 2016.04.30
티스토리(Tistory)에서 티에디션(T Edition)가운데 정렬.  (0) 2015.12.26
Camera for Android  (0) 2014.06.10
S3 작업  (0) 2014.06.07

Comment +0



아 정말...
우리나라 검색엔진에 실망하고
우리나라 사람들에 실망하는 순간이었다.



언제부터인가 웹 표준이 중요시되면서부터 즈음....
웹표준을 지키며 table에 height 100%가 적용되지 않았다.

<table height="100%">
<tr>
<td>
&nbsp;
</td>
</tr>
</table>




table에 height라는 속성은 표준이 아니라는것을 쉽게 알수 있었지만, 그럼 표준은 대체 무엇인가? 라는 의문과 함께 검색 고고싱.



1. CSS사용을 생활화하자.

일단은 귀찮더라도 CSS생활을 익히도록 하는것이 좋겠다.
(요즘엔 CSS로 별짓을 다 할수 있더라..)


그래서 적용한것이 바로...


<table style="height:100%;">
<tr>
<td>
&nbsp;
</td>
</tr>
</table>

얼레 그런데 왜 안되지?
CSS파일을 따로 둬서 적용해볼까?


table
{
height: 100%;
}


그래도 안된다.

왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까 왜일까



한국 검색엔진을 사용했더니
dtd부분을 없애라는 정말 어처구니 없는 답변밖에 없었다.
웹표준을 지키기위에 xhtml선언을 해주고 dtd부분만을 지우라니...
'권장은 아니지만 어쩔수없다'라는 말도 안되는 이유로;;;;;;
차라리 다 지우지 왜??

게다가 이런 잘못된 정보들을 뭐 좋다고 서로 퍼가고 퍼가고 복사하고 붙여넣고...
Copy, Paste, Copy, Paste, Copy, Paste, Copy, Paste, Copy, Paste, Copy, Paste.


참으로 답답한 순간이다.
난 정말이지 '답'이 없는줄알았다.


해외로 가보자.
영어 해석해야해서 머리 아파서 안하려고 했던 구글링 고고싱!~
처음 들어간 링크부터 답.답.답.
Solution, Solution, Solution.

결론은 table의 상위 부모인 body와 그 parent인 html태그에 까지 적용해야한다는것.
table을 감싸고 있는 부모부터가 작은데 table이 커질수 있을리가..

방법은 두가지 이다.

<html style="height: 100%;">
<body style="height: 100%;">
<table style="height: 100%;">
<tr>
<td>&nbsp;</td>
</tr>
</table>
</body>
</html>
이렇게 일일히 스타일 먹여주거나...


다만 당신들이 좋아하는... "권장하지 않는다"
비추다.

CSS를 익히란말이다!!
몸에 베어야한다!


html, body
{
  height: 100%;
}
요것이 솔루션.

css파일에 추가하고 적용해준다 ^^


CSS에 대해서는 따로 검색&공부해주세요 ^^
이건 국내 검색엔진으로 해도 수두룩 잘 배울 수 있습니다 ^^





Comment +2

  • 레므르스 2011.09.26 16:10

    음... 저 height 100%를 적용 테스트 하신 웹 브라우저가 몬가요??

    저게 안되는 경우 저는 경험을 못했거든요...

    익스로 저는 주로 작업을 하는거라...

    웹브라우저 마다 특정 명령어에 대한 먹힘 현상이 있고, 그리고 html을 어떤 식으로 선언을 하느냐에 따라서 조금의 차이는 있지만 저는 가끔 홈피 작업중으로 작업 할때 이미지 하나 만들어서 잘 사용을 하고 있습니다.

    • 제가 지금 쓰고있는 IE에서도 안먹던데요 ^^
      지금은 IE최신버전을 사용하고있습니다.
      (자동 업데이트 되는버전)