작은 화면에있을 때 내 페이지의 모든 것을 수평으로 정렬하려고합니다.페이지의 전체 내용을 가운데로 가운데로 놓습니다.
현재 모든 것이 올바르게 정렬됩니다.
@media screen and (max-width: 1038px) {
.wrapper{
margin-left: auto;
margin-right: auto;
width: 100%;
}
}
가 나는 또한 아무 소용 margin: 0 auto;을 시도 :
여기 내 CSS입니다. text-align:center;은 div의 텍스트 만 변경합니다.
내가 일하고 페이지는 http://tcsdesignreno.com/nvvolunteers/
당신이 도움을 주셔서 감사 할 수 있는지 알려 주시기 바랍니다!
본인은 사이트 요소에 대한 응답 및 응답을 살펴볼 것입니다. 비록 당신은 이미 이런 일이 벌어지고있는 것처럼 보입니다.
귀하의 목적에 맞는 구체적인 것을 찾아야 할 가능성이 있습니다. 그러나 이들 중 하나를 사용하고 그들이 어떻게하는지 보는 것은 자신의 솔루션을 요리하기위한 좋은 출발점이 될 것입니다.
이것들은 효과가 있을지 모르지만 나는 돌아가서 전체 사이트를 재구성하고 싶지 않습니다. 우리는 하루 두 차례에 걸쳐 시작하려고합니다. CSS로 래퍼 센터의 모든 요소를 만드는 방법이 있습니까? – MattM
대답은 '아니오'입니다. '.wrapper * {margin : 0 auto; }'마술 해킹. 특히 Responsive Design과 같은 웹 개발에 대해 더 잘 이해할 필요가 있습니다. 그게 당신이 원하는 것 같다. Responsive Web Design을 배우려면 웹에 많은 훌륭한 자료가 있습니다. 좋은 오래된 아날로그 서적 형태로 제공되는 더 우수한 제품도 있습니다. 내 친구에 대한 바로 가기가 없습니다. 그것에 집착하면 거기에 도달 할 것입니다. – hungerstar
당신은 다음과 같은 테이블을 사용할 수 있습니다 (그리드 참조)
<table width="1038px" align="center">
<tr>
<td>
your main content
</td>
</tr>
</table>
정말 내 HTML에서 테이블을 사용하고 싶지 않습니다. CSS로 할 수있는 방법이 있습니까? – MattM
나는 부서졌고 실제로 이것을 시도했지만 전혀 작동하지 않았다. – MattM
레이아웃을위한 테이블을 제안하고 '정렬'과 같이 거의 사용되지 않는 속성을 곧 사용하기 위해 Downvoted. – hungerstar
css
#content{
width: 1038px
margin-right: auto;
margin-left: auto;
padding: 10px; //paddig might make this width a but more so you might need narrow that
text-aling: center;
}
난 그 텍스트 aling의 권리를했다면 나는 확실히 모르지만 그런 일이 당신은 당신의 블록 요소에 더 많은 '응답'을 추가 할 필요가
도움이 될 수. 그들은 단지 좁은 컨테이너에 맞추기를 멈추고 쓰러지지만, 너비는 거의 동일하게 유지됩니다. – marlenunez
그건 생각입니다. 나는 그들 모두가 같은 너비를 유지하고 다른 사람들보다 아래쪽으로 움직이기를 바랍니다. 클라이언트는 요소가 더 넓어지는 것을 원하지 않습니다. 내가 중심에두기 위해 필요한 것은 왼쪽에 정렬하지 않아야합니다. – MattM
그런 경우에는 float를 제거하고 더 작은 너비의 CSS에 'margin : 0 auto'을 설정해야합니다. – marlenunez