핏빛 화성하늘 아래…

이를테면 li에 float:left를 먹여 이어붙인 목록에서 각 항목에 padding을 좌우로 20정도씩 주었다 치자. 이를 감싸고 있는 영역의 가로 너비가 500px 정도 되고 항목들이 그보다 길게 이어지면 자연스럽게 아래로 튕겨 내려가게 하려고 했다. 항목마다 길이가 달라야 해서 li에는 가로 너비가 주어져 있지 않다.

파이어폭스하고 오페라에선 항목 길이에 따라 만약 다 들어가지 않을라 치면 자동으로 아래로 튕겨준다. IE도 마찬가지로 대부분 튕겨는 주는데 오른쪽 모서리에 걸리는 녀석의 경우 '안 들어가니까 아래로 튕겨주는 것'이 아니라 감싸고 있는 영역 길이에 맞춰 가로 너비를 억지로 줄여 항목이 졸지에 줄을 바꿔 늘어난다. 당연히 레이아웃이 깨지고 만다. 혹시나 싶어 li가 아니라 각각을 div 영역으로 감싸서 처리를 해 봤지만 매한가지. 파이어폭스와 오페라에서는 의도대로 나온다. 사파리까진 안 해 봐서 모르겠지만, 표준 지켰고 저 둘이 저렇게 보여준다면 안 나오진 않겠지.

그러니까 width값을 줬냐 안 줬냐의 차이로 안 준 경우엔 가변성을 지니긴 하지만, 그래도 안에 뭔가가 들어차 있고 padding까지 붙어 있으니 하다못해 고정으로 지정한 padding값만큼이라도 소화가 안 되면 float:left;가 있으니 아래로 튕겨 내려가는 게 맞을 텐데. 이건 아예 찌그러뜨려서 맞추려 들고 있으니. IE는 보통 때도 영역에 너비를 지정해놔도 안에 있는 녀석 길이에 따라 죽죽 늘어나는 괴상함을 자랑하지만 이 경우는 대체 뭐라 설명을 해야 하는지 모르겠다.

…애초에 한 줄에 들어가는 항목 수가 매번 바뀌는데다 마우스를 올리면 하이라이트 처리도 해야 하는(심지어 화살표 아이콘도 떠야 한다) 주문이 와 있어서 고정값을 쓸 수도 없고, 나오는 항목수를 제한하게 해달라고 하는 것도 글자수를 검사해 내리는 것도 답이 아니지 싶은데 어쩌지 이걸.


후. 역시 UI 개발자들 웹디자이너들 다 죽어나든 말든 IE 사용 금지령을 내려야 한다니까. 진짜 이 녀석 상대하다 내가 늙는다. (……)