채택완료

가운데정렬 질문입니다

<div style="width:100%; width: 100%; margin: 0 auto;position: relative; ">



디스플레이&nbsp; 1920x1080 에는 전체화면 왼쪽으로 정렬되고

&nbsp; &nbsp; 1366 x 768 에는 가운데 정열되는것 같습니다.



가운데로 정렬되고 싶은데

문제가 어디서 잘못된건가요?



<div style="width:100%; width: 90%; margin: 0 auto;position: relative; ">

하면

1920x1080&nbsp; 에서는 가운데로 정렬됩니다.

1366&nbsp; 768 에서는 왼쪽으로 정렬됩니다.
|

답변 3개

채택된 답변
+20 포인트

<div style="width:100%; width: 100%; margin: 0 auto;position: relative; ">

<div style="width:100%; width: 90%; margin: 0 auto;position: relative; ">

style width 는 2개가 들어갈수 없습니다. 
margin 에 속성은 외부 여백을 위 부터 북 동 남 서 시계방향으로 입력합니다. 
 auto 가 들어가면 바깥쪽 여백을 자동 조절하니 가운데 정렬이 됩니다. 
position: relative 는 바깥에서 감싸고 있는 요소에 영향을 받는데 최상위 창이라면 꼭 필요하지는 않습니다.  

위와 같은 경우는 먼저 width 속성에 테스트 하시는 해상도 보다 낮은 가로 px 입력 하여 확인해 보시기 바랍니다.

예) <div style="width:1000px; margin: 0 auto;"> 

이 경우에서 이상이 보인다면 브라우저에서 검사를 통해 적용되어 있는 CSS 스타일을 확인해 보시고 불필요한 부분 제거 하시면 됩니다. 

 

위 코드만으로는 알수가 없어요. url 정도는 기재해주시는게 좋을듯 합니다.

<div style="width:100%; width: 100%; margin: 0 auto;position: relative; ">
== align 관련 내용이 없으니 기본 정렬값은 왼쪽 입니다.
== 해상도 관련해서 center 가 없으니 당연히 해당 코드에서는 작동하지 않는 코드 입니다.
아마도 다른 css 참조에서 이루어지는것 같습니다.

제 프로필 보시면 무료 상담 오픈카톡이 있는데요
이쪽으로 문의주시면 왜 그런지 정도는 봐드릴수 있습니다.
위 코드만으로는 두 해상도에서 달리 작동할 이유가 없어보입니다.
가운데정렬원리 정리해뒀으니 시간내서 공부해 보세요.
https://homzzang.com/b/css-254 (목차 1번)
 

답변을 작성하려면 로그인이 필요합니다.