Alterar largura do Header

OBS: px, é um sistema de medida no qual significa pixels (1 px, 700 px, 2 px, etc)

Pessoal, eu falo Header porque, na minha opinião, é um termo mais bonitinho que Cabeçalho, mas é a mesma coisa rs.
Um problema muito freqüente que acontece com pessoas, que assim como eu fazem imagens que acabam ultrapassando o tamanho do Header e fica aquela coisa horrível quase saindo fora da página, são as medidas.
Bom, eu vou explicar aqui como resolver o problema do Header pequeno ou grande demais, isso pra quem insere imagens direto pelo HTML, porque na inserção automática de imagens pelo layout de edição, ele redimenciona a imagem conforme o tamanho do cabeçalho do seu template.
É necessário muita paciência, porque medida é algo bastante delicado.

Para quem quer simplesmente aumentar a largura do topo, siga essas etapas:

1º Encontre no códogo do seu template o seguinte trecho:

/* Header----------------------------------------------- */
#header-wrapper
{ width:800px;
height: 35o px;
margin:0 auto 10px;
border:8px solid #FFD7EB;
}
(Pode acontecer de que em alguns templates venha escrito diferente, mas vale ressaltar que eu estou utilizando como base o template Mínima)

2º No trecho acima, mude o valor de width (que significa largura), para um valor maior ou menor conforme a sua preferência. Se o valor do seu width for 800 px e você quiser um header maior, mude a largura para um valor maior que 800 px e vice-versa

3º Essa etapa é muito importante, pois é o que adaptará a estrutura do seu template ao novo valor da largura do seu Header. Encontre o trecho:

/* Outer-Wrapper----------------------------------------------- */

#outer-wrapper {
width: 800px;
margin:0 auto; padding:5px;
text-align:left;
font: $bodyfont;
background: #000000; }

5º Deixe o valor de width, de acordo com o novo valor do seu Header. Ex: se o seu Header for 800 px, então outer-wrapper também deverá ser 800 px.

P.S.: Se você aumentar o Header, poderá ficar sobrando um espaço entre o lado da sua sidebar e o canto da página, agora se você diminuir, uma parte da sua sidebar será cortada, ou seja, haverá uma bagunça nas colunas, então confira os posts sobre aumentar e diminuir sidebars.

0 comentários: