Layouts de largura fixa podem ser difíceis de centralizar com alguns dos navegadores populares que existem, mas é possível, com apenas algumas linhas de código.
Veja como
- Crie uma nova página da web com uma folha de estilo CSS em seu editor de HTML.
- Crie um elemento div como o elemento principal na página onde você armazenará tudo na página.
- Dê a esse elemento div um ID exclusivo na página.
- Abra sua folha de estilo CSS e defina a largura do seu elemento div: div # main {width: 750px; }
- Adicione margens automáticas para centralizar seu div: div # main {width: 750px; margem esquerda: automático; margem direita: auto}
- Para corrigir isso no Netscape 4 e no IE 4 – 6 (modo peculiaridades), adicione um alinhamento de texto no corpo: body {text-align: center; }
- Mas então todo o texto interno é centralizado, então realinhe o texto em seu div #main adicionando text-align: left; lá: div # main {width: 750px; margem esquerda: automático; margem direita: automático; alinhamento de texto: esquerda; }
- Salve sua página e sua folha de estilo.
- Teste seu trabalho em vários navegadores da web.
Isso centralizará a caixa de layout, mas não o conteúdo dentro dela. Use o alinhamento de texto para centralizar o conteúdo interno.
Formato mla apa chicago Sua Citação
Kyrnin, Jennifer. “Centralize um documento com um layout de largura fixa usando CSS.” ThoughtCo, maio. 14 de 2021, thinkingco.com/center-document-with-fixed-width-layout-3466906.
Kyrnin, Jennifer. (2021, 14 de maio). Centralize um documento com um layout de largura fixa usando CSS. Obtido em https://www.thoughtco.com/center-document-with-fixed-width-layout-3466906
Kyrnin, Jennifer. “Centralize um documento com um layout de largura fixa usando CSS.” ThoughtCo. https://www.thoughtco.com/center-document-with-fixed-width-layout-3466906 (acessado em 24 de maio de 2021).