위키 작성할 자료는 충분한데 게임 진척이 다소 느린 편이라 위키 문서를 꾸미고 있습니다.
제 목표는 2차 섹션을 위 그림과 같이 바꿔보는 겁니다.
2차 섹션 내부에 div태그를 사용한 결과입니다.
위 그림처럼 어느정도 꾸밀 수 있게 나오긴 하지만
[편집|원본 편집]이 아래로 내려가서 뭔가 신경쓰이게 됩니다.
2차 섹션 내부에 Span을 쓴 결과입니다.
div와는 다르게 span태그는 [편집|원본 편집]이 오른쪽에 딱 붙어줍니다.
다만 제가 연구해본 결과로는 아마 div와 span 크기 조정이 불가능한 것 같습니다.
아직 경우의 수를 다 써본 건 아닌데 그런 것 같다고 지레 짐작중입니다.
개발자도구로 뜯어봤더니 크기 변경은 되는데 margin이 나머지 장소를 차지해버립니다.
margin크기를 따로 지정해줘도 변경이 안되더라고요.
그래서 꼼수로 2차 섹션을 div로 덮고 2차 섹션 글자를 span으로 덮었습니다.
이 경우 원하는대로 되기는 하는데 그림까지 넣으려면 연구를 좀 더 해야할 것 같습니다.
실험결과 대충
div는 행방향의 나머지 부분이 margin으로 덮이는 것 같고
span은 열방향의 나머지 부분이 margin으로 덮이는 것 같습니다.
이 margin을 유저가 따로 변경할 수는 없어보이는 것 같습니다.
근데 지금보니까 마지막 소스코드 틀렸네요.
style을 뺴먹어버렸군요.
다음번에 실험해서 -webkit-background-clip이 먹히는 지 연구해봐야겠네요.