컨테이너 div가 있습니다. 너비 : 80 %, 마진 - 왼쪽 : 10 % 및 마진 - 오른쪽 10 %. 문제는 내가 점검 한 모든 브라우저에서 컨테이너가 왼쪽에 표시된다는 것입니다. margin-left의 값을 20 %로 변경하면 괜찮아 보입니다.CSS가 센터링하지 않습니다.
필요한 경우 코드를 제공 하겠지만 여기에 분명히 잘못된 것이 있습니까? div를 센터링하기 위해 각면에 10의 여백을 갖는 80이 맞지 않습니까?
GF
설정을 시도했지만 정상적으로 작동합니다.
CSS의 철자 및 구문을 확인하십시오. CSS의 작동을 방해하는 오류가있을 수 있습니다. Firefox에서 오류 콘솔을 열고 페이지를 다시로드하면 CSS 오류에 대해 알려줍니다.
margin-left: auto; margin-right: auto;을 사용하여 요소를 가운데에 맞출 수도 있습니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title>Test</title>
<style type="text/css">
div { width: 80%; margin-left: 10%; margin-right: 10%; background: #ccc; }
</style>
</head>
<body>
<div>asdf</div>
</body>
</html>
이 theese 설정하려고 :
<html>
<head>
<style>
.container {
position: relative;
margin-left: auto;
margin-right: auto;
width: 80%;
background-color: red;
}
</style>
</head>
<body>
<div class="container">
Testing page
</div>
</body>
</html>
그래도 문제가 해결되지 않습니다. 좌우의 여백을 10 %로 설정 한 것과 같은 결과입니다. –
나는 코드를 업데이트하고 잘 작동한다. 시도해보십시오. :) –
감사. 그것은 실제로 HTML 문제였습니다. 나는 필요하지 않은 여분의 div를 포함 시켰습니다. 문제가 해결되었습니다. –
이 사업부 지정된 witdh의 부모 요소가 여기에
내가 CSS를 테스트하는 데 사용되는 페이지의 코드는?없음 오류가 불을 지르고 CSS의 오류 콘솔에 표시되지 않습니다 부모 요소
본문의 너비 (div의 부모)를 100 %로 설정했지만 아무 것도 변경하지 않습니다. –
에 대한
을보십시오. –@user : 위에 사용 된 코드를 추가했습니다. – Guffa