Quando uma div sumir, a outra aumentar

[Diego Parente 0]

Boa tarde.

 

Estou editando um tema do Wordpress que é responsivo, mas desatualizado e o que tem ocorrido é o seguinte:

 

Quando diminuo o tamanho da tela, a barra lateral desce, mas o texto contido na página continua a ocupar somente 70% de largura, quando eu queria que passasse a ocupar os 100%, já que a barra lateral não está mais lá, ficando 30% do espaço em branco.

 

Gostaria, se possível, de, no lugar de descer, a barra lateral sumisse quando chegasse a determinado tamanho.

 

Obrigado.

[guilomaker 31]

e só você configurar o @media pra essa resolução que você quer, descubra que resolução e essa.

 

ai no media dessa resolução você pega a div que esta o texto e aumenta seu width pra 100% e a barra que você quer remover, e só colocar um display:none;

[Diego Parente 0]

O ideal seria utilizar o arquivo style.css, importar um novo ou tanto faz?

Coloquei no formato abaixo. A sidebar sumiu, mas a "primary content" continua em apenas 70% :/

 

@media screen and (max-device-width:667px) {

#sidebar{display:none;}

#primary-content{width:100%;left:0;}

}

[guilomaker 31]

essa primary-content e a div que cuida do width de onde esta o texto? tem alguma outra div ate chegar no texto? veja se nao tem alguma div dentro dela com width definido. se tiver como postar essa parte do codigo, ai fica melhor pra ajudar, mais o caminho e esse ai.

[Diego Parente 0]

Deu certo, Guilomaker.

 

Adicionei tanto um media query para max-device, quando só para max-width.

 

No mesmo foco, surgiu outra dúvida:

Quero adicionar uma imagem de fundo no rodapé. De início, tentei aproveitar os mesmos media queries, mas não funcionou, até que tive a ideia de colocar embaixo dos comandos de rodapé já existentes no style.css e funcionou para um deles.

 

Segue o comando:

 

@media screen and (min-width:900px) {

#footer{background:transparent url(images/baixo.jpg) no-repeat left top;}

}

O problema é que mesmo quando diminuo a tela do navegador, a referida figura continua aparecendo. Sabes dizer o que pode ser, pois eu só queria que ela aparecesse quando o navegador estivesse em um tamanho acima de 900px, ou seja, só aparecesse para desktops, mas está aparecendo também para celular, o que acaba por prejudicar o design, pois a imagem fica toda bagunçada no smartphone.

[guilomaker 31]

coloque um max de 899 e de display none no footer. ai de 899 pra baixo ele não vai exibir o footer.