Publicado em 27 de jun.

Ignorar div

Olá, eu estou montando meu layout responsivo, porém eu criei uma div para aparecer somente ele em dispositivos, até ai tudo bem.

Defini ele como visibility: hidden; para monitores maiores, mais a div ainda continua ocupando espaço, ou seja, se ela tem uma largura de 500px; eu ocultei ela, mais o espaço dela continua, queria saber se á alguma forma de ignorar essa div, e nesse espaço que não aparece não eu por algo por cima.

Discussão (5)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

codercss· 27 de jun.

Olá,

De responsive não percebo muito. Mas pelo que percebo de css a propriedade "visibility: hidden" apenas oculta o elemento no momento do desenho da página (quando o html e o css se juntam).

Experimente assim: display: none;

Faça debug neste código e veja a diferença entre as propriedades display e visibility:

<!DOCTYPE html>

<html>
<head>
<style>
.none {
 display: none;
}

.hidden {
 visibility: hidden;
}
</style>
</head>
<body>

<div class="none">
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
</div>

<div class="hidden">
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
 <p>This is a paragraph.</p>
</div>

</body>
</html>

AndersonMamede· 27 de jun.

É como o @codercss falou. O visibility:hidden apenas deixa o elemento não visível, mas ele ainda ocupa espaço na tela. Se você quer ocultá-lo totalmente, utilize none.

Worn· 27 de jun.

mais se eu ocultar ele em monitores maiores, em smarthphones ele também será ocultado.

AndersonMamede· 27 de jun.

Então aplique esta regra apenas para smartphones...você pode utilizar media query para fazer isso...

codercss· 27 de jun.

Veja a minha resposta neste tópico: http://forum.imasters.com.br/topic/550352-trocar-automaticamente-design-mobile-no-celular/

Bons códigos