Fazer div ocupar 100 % da tela

[william]

Galera estou com a seguinte situação

<style rel="stylesheet" type="text/css">

.tudo {  width: 100%;}

.menu { float: left; width: 25px; background-color: #000; }

.conteudo { float: left;background-color: #ccc;}

</style>

<!-- HTML -->
<div class="tudo">

<div class="menu">Menu</div>

<div class="conteudo">Conteúdo</div>

</div>

Gostaria que a div "CONTEUDO" ocupasse sempre o comprimento total da tela, ou seja fosse até barra de rolagem.

[Emmanuel Oliveira]

você pode dar um style na propria div e por o width 100%..

2011/3/8 william <willi...@gmail.com>

--
Grupo de jQuery Brasil.
 
REGRAS: http://groups.google.com/group/jquery-br/web/regras-do-grupo
 
USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
 
Email: jque...@googlegroups.com
Biba: jquery-br+...@googlegroups.com
Site: http://groups.google.com/group/jquery-br?hl=pt-BR

--
Att,
Emmanuel Oliveira
8758.4787
Skype: emmanuel.monteiro
Gtalk: emmanuel...@gmail.com

[william]

em qual div ?
na

.conteudo { float: left;background-color: #ccc;width: 100%;}

nao funciona...
pois ai, ela é deslocada pra baixo da .menu

2011/3/8 Emmanuel Oliveira <emmanuel...@gmail.com>

[Emmanuel Oliveira]

<div class="conteudo">Conteúdo</div>

2011/3/8 william <willi...@gmail.com>

[william]

como falei acima não funciona.

[william]

Funcionou eu tava durmindo..auhsausahusa
Mas agora surgiu outra dúvida..

<style rel="stylesheet" type="text/css">

.menu { float: left; width: 250px; background-color: #fff; }
.conteudo { background-color: #000;}
.conteudo2 {position:relative; background-color: #ccc;}
</style>

<div class="menu">Menu</div>

<div class="conteudo">

   <div class="conteudo2">   asdsa
   </div>
</div>

No exemplo acima.. a div conteudo está ficando em cima da div menu..alguma dica para que eu possa resolver isso ?

2011/3/8 william <willi...@gmail.com>

[Marlon Renan Teixeira]

Se você colocar clear:both no .conteudo acho que funciona

<style rel="stylesheet" type="text/css">
.menu { float: left; width: 250px; background-color: #fff; }

.conteudo { background-color: #000; clear:both;}

.conteudo2 {position:relative; background-color: #ccc;}
</style>

abraço

2011/3/8 william <willi...@gmail.com>

[Ricardo]

cara, não entendi direito o que você está querendo.
voce quer separar a sua tela em dois? uma barra para a div menu e
outra para a div conteudo?

On 8 mar, 21:10, william <william....@gmail.com> wrote:
> Funcionou eu tava durmindo..auhsausahusa
> Mas agora surgiu outra dúvida..
>
> <style rel="stylesheet" type="text/css">
> .menu { float: left; width: 250px; background-color: #fff; }
> .conteudo { background-color: #000;}
> .conteudo2 {position:relative; background-color: #ccc;}
> </style>
>
> <div class="menu">Menu</div>
>
> <div class="conteudo">
>    <div class="conteudo2">   asdsa
>    </div>
> </div>
>
> No exemplo acima.. a div conteudo está ficando em cima da div menu..alguma
> dica para que eu possa resolver isso ?
>

> 2011/3/8 william <william....@gmail.com>

>
>
>
>
>
>
>
> > como falei acima não funciona.
>
> > pois ai, ela é deslocada pra baixo da .menu
>

> > 2011/3/8 Emmanuel Oliveira <emmanuel.monte...@gmail.com>

>
> >> <div class="conteudo">Conteúdo</div>
>

> >> 2011/3/8 william <william....@gmail.com>

>
> >>> em qual div ?
> >>> na
>
> >>> .conteudo { float: left;background-color: #ccc;width: 100%;}
>
> >>> nao funciona...
> >>> pois ai, ela é deslocada pra baixo da .menu

> >>> 2011/3/8 Emmanuel Oliveira <emmanuel.monte...@gmail.com>

>
> >>> você pode dar um style na propria div e por o width 100%..
>

> >>>> 2011/3/8 william <william....@gmail.com>

>
> >>>>> Galera estou com a seguinte situação
>
> >>>>> <style rel="stylesheet" type="text/css">
> >>>>> .tudo {  width: 100%;}
> >>>>> .menu { float: left; width: 25px; background-color: #000; }
>
> >>>>> .conteudo { float: left;background-color: #ccc;}
>
> >>>>> </style>
>
> >>>>> <!-- HTML -->
> >>>>> <div class="tudo">
>
> >>>>> <div class="menu">Menu</div>
> >>>>> <div class="conteudo">Conteúdo</div>
> >>>>> </div>
>
> >>>>> Gostaria que a div "CONTEUDO" ocupasse sempre o comprimento total da
> >>>>> tela, ou seja fosse até barra de rolagem.
>
> >>>>> --
> >>>>> Grupo de jQuery Brasil.
>
> >>>>> REGRAS:http://groups.google.com/group/jquery-br/web/regras-do-grupo
>
> >>>>> USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
>
> >>>>> Email: jque...@googlegroups.com
> >>>>> Biba: jquery-br+...@googlegroups.com
> >>>>> Site:http://groups.google.com/group/jquery-br?hl=pt-BR
>
> >>>> --
> >>>> Att,

> >>>> *Emmanuel Oliveira*
> >>>> *8758.4787
> >>>> Skype: emmanuel.monteiro
> >>>> Gtalk: emmanuel.monte...@gmail.com*
>
> >>>> * <emmanuel.monte...@gmail.com>*

>
> >>>> --
> >>>> Grupo de jQuery Brasil.
>
> >>>> REGRAS:http://groups.google.com/group/jquery-br/web/regras-do-grupo
>
> >>>> USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
>
> >>>> Email: jque...@googlegroups.com
> >>>> Biba: jquery-br+...@googlegroups.com
> >>>> Site:http://groups.google.com/group/jquery-br?hl=pt-BR
>
> >>>  --
> >>> Grupo de jQuery Brasil.
>
> >>> REGRAS:http://groups.google.com/group/jquery-br/web/regras-do-grupo
>
> >>> USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
>
> >>> Email: jque...@googlegroups.com
> >>> Biba: jquery-br+...@googlegroups.com
> >>> Site:http://groups.google.com/group/jquery-br?hl=pt-BR
>
> >> --
> >> Att,

> >> *Emmanuel Oliveira*
> >> *8758.4787
> >> Skype: emmanuel.monteiro
> >> Gtalk: emmanuel.monte...@gmail.com*
>
> >> * <emmanuel.monte...@gmail.com>*

[william]

isso mesmo..mas na div meu eu terei tamanho fixo, já na div conteudo eu quero que ela ocupe o resto da tela..

2011/3/11 Ricardo <rdeve...@gmail.com>

[Edu Ribeiro]

Se vc quer q ocupar o resto da tela use 100% e a div conteudo tira o position relative . O certo é a div ficar em baixo do menu ...pois no fluxo de blocos fica 1 por linha , ja float fica 1 do lado do outro !!

Eduardo R. Lima
C: 9106-8090

 

---

Date: Fri, 11 Mar 2011 11:10:49 -0300
Subject: Re: [jquery-br] Re: Fazer div ocupar 100 % da tela
From: willi...@gmail.com
To: jque...@googlegroups.com

[Thiago Rezende]

Willian, ta ai a tua solução:

<style rel="stylesheet" type="text/css">

html, body{ margin:0; padding:0; width:100%;}
.menu {float: left; display:inline; background-color: #f00; width:
250px;}
.conteudo{background-color: #ccc;}
</style>

<body>
<div class="menu">menu</div>
<div class="conteudo">conteudo</div>
</body>


Atte,
Thiago Rezende
http://www.thiagorezende.com.br

On 11 mar, 11:10, william <william....@gmail.com> wrote:
> isso mesmo..mas na div meu eu terei tamanho fixo, já na div conteudo eu
> quero que ela ocupe o resto da tela..
>

> 2011/3/11 Ricardo <rdevelo...@gmail.com>

[william]

ok,vlwww

2011/3/12 Thiago Rezende <thr...@hotmail.com>

[Ricardo]

Eu estou fazendo assim:

$('.conteudo').css({'width' : $(window).width(), 'height' : $
(window).height()-X});

onde X seria o tamanho da div menu.
Espero ter ajudado.

[william]

Thiago, mas da maneira que voce mandou caso eu diminua bastante o tamanho da janela, a div conteudo fica em baixo da div menu..
Tem como fazer com que a div conteudo não vá para baixo ???

2011/3/12 Ricardo <rdeve...@gmail.com>

--

[Thiago Rezende]

Willian, desta maneira que te passei a div conteúdo só desce quando a
largura do browser é menor que a soma da largura da div menu + a
largura do "conteúdo" da div conteúdo, neste caso nao há solução
mesmo, a div conteúdo irá descer por falta de espaço...

A única solução que você pode usar para esta div não descer é colocar
overflow:hidden; no css, mas dai ela vai esconder o conteudo de acordo
com a largura da div, neste caso não sei se é viável..

Atte,
Thiago Rezende,
http://www.thiagorezende.com.br

On Mar 12, 7:04 pm, william <william....@gmail.com> wrote:
> Thiago, mas da maneira que voce mandou caso eu diminua bastante o tamanho da
> janela, a div conteudo fica em baixo da div menu..
> Tem como fazer com que a div conteudo não vá para baixo ???
>

> 2011/3/12 Ricardo <rdevelo...@gmail.com>