마크업개발 메모장

줄바꿈 하는데 br 아니면 span을 주로 사용했었는데 css로 훨씬 간단하게 줄바꿈을 할 수 있다!! 바로 요 div { white-space : pre-line; } 방법을 사용하면 가능하다!white-space 이건 공백 문자를 어떻게 처리할지 결정하는 속성이다. 속성 값으로는normal : 기본 값으로 연속하는 공백을 하나로 처리한다.nowrap : 연속하는 공백을 하나로 처리하고 줄바꿈을 하지 않는다.per : 연속하는 공백을 원본 그대로 표시하고 줄바꿈도 한다. 원본 그대로 표시한다. 영역에서 벗어날 수 있다.pre-line : 연속하는 공백은 하나로 취급하고 줄바꿈을 한다. width에 맞춰진다. pre-wrap : 연속하는 공백을 원본 그대로 표시하고 줄바꿈도 한다. width에 맞춰진다...

크롬, ie, 파폭, 안드로이드에서는 문제없이 보이는데 사파리에서만 레이아웃이 틀어지는걸 발견했다. ㅠㅠ 멘붕멘부우ㅜ 위에 떠있는 놈에 overflow:hidden;을 주니까 제대로 나왔다!! 이렇게 되면 원인은... 높이값을 정해주지 않아서인것같다... 맞는지는 아직 잘모르겠다. 앞으로 더 연구해봐야지ㅠㅠ 이 덕에 사파리는 꼭 아이폰 기기에서 한번 더 확인 해야겠다는 깨달음을 얻었다....^_T + 내용 추가 )공부하다 보니 이것은 이미 float으로 레이아웃을 잡아줄때 많이 사용되는 방법이었다.overflow :hidden; , overflow :auto; 둘다 사용해도 별 문제 없는 것 같다.나만 몰랐다....ㅠㅠ 혼자서 작업하다보니 조금 느리게 습득하는 것도 있지만 어쨋든 스스로 해결하는게 뿌듯하..