수다닷컴

relative로 위치 잡는 데에서 문제가 생겼어요

화1이트 2025.12.13 댓글 5

div id=content
div id=left/div
div id=center/div
div id=right/div
/div

위와같은 구성에서 content안의 div위치를 CSS에서 position: relative로
각각의 위치를(html에서 코딩한 순서와는 다르게) 잡았습니다.

[center][left][right]
이런식으로 나오기를 원했는데

[left]
[center]
[right]

이렇게 나와버리네요...
어떻게 하면 문제를 해결할 수 있을까요?

댓글 5

  • 백합 2025.12.13

    수다님 말대로 디자인상 float로 가능하시면 float로 하시는게 확장성에 더 좋습니다.

    그게 어려울경우에는content에 relavite를 주시고 나머지 element에 absolute를 주세요

  • 가장 2025.12.13

    이것저것 섞어서 쓴다는게 더 복잡하게 되었는데 말씀들을 들으니 제대로 되네요~~ㅎㅎ 고맙습니다~~

  • 꽃초롱 2025.12.13

    #content { width: 500px;}
    #content div { position: relative;}
    #content div#left { top: 0px; left: 300px; width: 100px; float: left; }
    #content div#center { top: 0px; left: -100px; width: 300px; float: left; }
    #content div#right { width: 100px; float: ri

  • 작약 2025.12.13

    position으로는 구현이 힘들고 float을 사용하세요.

  • 쇼코홀릭 2025.12.13

    center를 left가 차지하고 있었던 영역만큼 음수값으로 옮겨주고, left를 center가 차지한(원래 left영역으로 들어와야 하니까 위에서 보면 300px이겠죠) 영역만큼 밀어내주면 대충 위치는 바뀌게 될겁니다.

프로그램 개발일반 다른 글

목록