반응형블로그 이미지크기 모바일에 맞게 구성 블로그꾸미기팁

반응형블로그 이미지크기 모바일에 맞게 구성 블로그꾸미기팁

하루 꼬박 걸렸네요.

나도 한때는 정말 날렸는데...

그동안 수익형으로 좀 매진하다보니 한동안 소홀했습니다.

다시 한번 날아볼까 하여 블로그꾸미기 부터 다시 해봅니다.

어제 반응형블로그 스킨을 좀 바꿨습니다.

종전 블로그 이미지 사이즈 문제가 좀 있었죠.

그런데 당혹?

하루종일 풀지못한 숙제가 있었죠.

밤에 술약속이 있어서 나갔었는데도 오직 그생각 밖에는 안되더군요.

반응형블로그 기본툴을 사용하기로 하였습니다.

여러가지 해봤지만 역시 기본에 충실하는 것이 가장 좋더군요.

블로그꾸미기팁 오늘은 딱 두줄의 미학입니다.

제가 하루종일 고민했던 부분.

반응형블로그 만들때 모바일 부분에 집중해 보았습니다.

요즘은 거의 모바일 건색이 많더군요.

그런데 하단의 배너가 문제였습니다.

pc에서 보이는 그림과 스마트폰에 보이는 그림의 차이!!!

결론부터 이야기 한다면 하루동안 머리 싸매고 있던 부분이 딱 세줄.

css 부분에 두줄을 첨가해 주니 해결되더군요.

html, body{height:100%;min-height:100%}

img {max-width: 100%; height: auto;}

span.imageblock {max-width: 100%; height: auto;}

정말 너무 당혹스럽더군요.

문제는 반응형블로그 구성한뒤 하단의 배너 부분이 문제였습니다.

수익형으로 하다보니 두개의 배너가 필수적으로 들어가야 하는데 사이즈가 문제였죠.

즉 모바일에서 필요한 350사이즈 부분으로 담을 것인가?

아니면 pc에서의 840사이즈를 선택할 것인가?

별의별 일을 다 했습니다.

그런데 모바일에서는 사이즈 조정이 안되더군요.

아래쪽 배너가 우측으로 튀어 나와서 모바일에서 스크롤 하다보면 우측으로 밀리고...

정말 당혹...

그렇게 하루를 헤매이다 정답을 찾아냈습니다.

바로 css 부분에 위의 두줄을 더 넣어준 것이죠.

이미지 100% 높이는 auto 

이 간단한 부분을 왜 티스토리 에서는 반응형블로그 부분에 넣지 않았을까?

풀지못한 숙제를 푼 그때.

기분 짜릿 하죠.

하지만 겨우 두줄의 해답에 조금 허망하기도 합니다.

이제 모바일에서도 pc에서도 자유롭게 배너를 달아볼수 있어서 일단 뿌듯 하네요.

열심히 또 달려야 겠죠.

반응형블로그 이제 툴은 완성되었으니 글을 써야 겠네요.

너무 무관심했던 부분을 조금 반성하면서...

오늘은 블로그꾸미기 마무리 작업.

후후 아직 메인에 이미지 한장 바꾸는 작업 하나가 남았습니다.

다른 서브 블로그 역시 요 반응형블로그 부분으로 바꿔볼까 합니다.

술한잔 마시고, 집에와서 다시 파헤쳐 보았다는...

그래서 아침에 일어나자마자 지금까지 고민한 부분.

정말 반응형블로그 간단히 끝낼 작업이었는데 너무 방황했네요.

이제 밥먹어야 겠습니다.

숙제를 마친뒤의 밥.

꿀맛일듯 합니다.