.readcomment {
padding: 20px 20px;
width: 735px;
min-height: 70px;
border-radius: 25px;
background-color: black;
background: rgba(35,30,25,0.7);
color: #FFF;
font-size: 15px;
line-height: 20px;
word-break: break-all;
p-osition: relative;
margin: -105px auto 0px 150px;
}
div 이름은 넘어가고
padding: 20px 20px;
본문 여백지정입니다
width: 735px;
div 의 가로크기를 나타냅니다.
min-height: 70px;
최소높이를 지정합니다. 지정하지 않을경우 한줄 코멘트의 경우 한줄에 맞춰서
높이가 지정되어집니다. 기본레이아웃 잡기 위해 지정하는 겁니다.
border-radius: 25px;
테두리 꼭지점을 둥글게 지정합니다. CSS3 명령어 중 하나로 크롬 이나 익스 11
이하의 브라우져에서는 동작하지 않을 수 있습니다.
background-color: black;
background: rgba(35,30,25,0.7);
백그라운드 색상을 나타냅니다. url을 넣어서 그림을 넣을 수도 있고 색상을
넣을 수 있는데 밑에 rgba는 알파값이 들어간 명령어로 브라우져 특성을 탑니다.
그러기 위해서 위에 백그라운드-컬러 코드를 넣어 하단 코드가 안 먹을 시 임의
로 적용되게 했습니다. CSS는 같은 코드 일 경우 마지막 줄 코드가 우선 적용
됩니다. 이점 유의해 주세요.
color: #FFF;
글자색입니다. 위 백그라운드 컬러가 브라우져 특성을 타서 지정 되지 않을 경우
흰색으로 나오는데 그것을 방지하기 위해 임의로 백그라운드 컬러 블랙을 더 넣
은 거에요. 호환성을 위한 일종의 꼼수입니다.
font-size: 15px;
line-height: 20px;
같같 글자 크기 와 줄간격입니다. 설명은 이전 파트에서 했으니 넘어갑니다.
word-break: break-all;
코멘트가 들어 가는 경우 이 코드는 추가 해 주시는게 좋습니다.
완성된 문자가 아니더라도 줄넘김 하기 위한 코드에요. 이 것을 지정하지 않을 시
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa 일 경우 div테두리를 넘어가도 줄넘김이 안됩니다.
p-osition: relative;
포지션 코드의 경우 이전에 설명 했으므로 생략 혹시나 다시 말하지만 - 는 빼주셔야 합니다.
margin: -105px auto 0px 150px;
이전 파트에서 설명 했으므로 추가 설명은 없습니다만 수치가 높으면 의외인 곳에서 레이아웃
이 파괴 될 경우가 있으니 수시로 모니터링 해서 수정해주세요.
일단 제 마이피는 보이는대로 수정한 편이긴 하지만 제 스킨을 가져가신 분들 중 수정이 힘든
분들이 있으니 수시로 업데이트 되는 스킨을 적용 시켜 주심 됩니다.
엘더 프레데터
조금 있다가 여태까지 올려주신 게시글 참고해서 수정해 봐야겠네요 : )