Como fazer uma div de ajustar ao conteúdo automaticamente

[Joelson Soares Estevam 0]

Olá pessoal, sou novo por aqui. Então, gostaria de saber como fazer para uma box CSS, um div, se ajustar automaticamente ao seu conteúdo sem uso das propriedades width e height. Para ser mais exato no que preciso, veja esse menu que não ficou completamente ajustado na div que o contém http://joelsonblog.p.ht/joelson/. Viu que fica uma aresta em branco no canto direito da barra de menu? Como posso fazer para resolver isso. Teria um jeito de acomodar o menu à div?

 

 

[stromdh 15]

cara, tu pode setar um tamanho pra essa div em px que ela fica exatamente do tamanho do menu. tu poderia usar um max-width pra ela não ficar estaquiada na largura mesmo com resoluções menores ou fazer uma gamba sinistra que é a seguinte:

 

width: auto;
margin: 0 auto;
background: rgba(237, 237, 222, 0.0);
min-height: 53px;
padding: 1px;

esse é o teu código, só mudei uma propriedade, testa lá pra tu ver negão.

[Marcos Xavier 189]

overflow:auto no CSS da div

[Joelson Soares Estevam 0]

cara, tu pode setar um tamanho pra essa div em px que ela fica exatamente do tamanho do menu. tu poderia usar um max-width pra ela não ficar estaquiada na largura mesmo com resoluções menores ou fazer uma gamba sinistra que é a seguinte:

 

width: auto;
margin: 0 auto;
background: rgba(237, 237, 222, 0.0);
min-height: 53px;
padding: 1px;

esse é o teu código, só mudei uma propriedade, testa lá pra tu ver negão.

Cara, primeiramente agradeço pela atenção, mas não resolveu... ficou da mesmo forma.

 

overflow:auto no CSS da div

Cara, primeiramente agradeço pela atenção, mas não resolveu... nesse caso, o menu quando expandido fica "overflado" com uma barra de rolagem vertical e não deixa ver as opções de menu.

[Marcos Xavier 189]

Desculpa Joelson falei m*****.

 

 

overflow:auto;

 

Cria a barra de rolagem mesmo. O mais correto é:

 

 

 

height:auto; 

[Andrew Marques 47]

Na div container_menunav coloca margin:0 e padding:0.

 

Na div contem_tudo coloca margin:0 e padding:0.

 

Depois só ajustar a largura do menu. :rolleyes:

[Maujor 144]

Faça as seguintes alterações e acréscimos nas regras de estilos:

 

#container_menunav { 
  ...
  padding: 1px 0; 
}

#nav {            /* retire as declarações de border deste seletor
                 elas não fazem nada */
  ...
  width: 100%;
  margin: 0;
}

#nav li {  
  ... 
  width: 13.97%;
  margin: 0.15%; 
}

#nav li a { 
  ... 
  width: 100%; 
  padding: 1em 0; 
}

[Joelson Soares Estevam 0]

 

Faça as seguintes alterações e acréscimos nas regras de estilos:

 

#container_menunav { 
  ...
  padding: 1px 0; 
}

#nav {            /* retire as declarações de border deste seletor
                 elas não fazem nada */
  ...
  width: 100%;
  margin: 0;
}

#nav li {  
  ... 
  width: 13.97%;
  margin: 0.15%; 
}

#nav li a { 
  ... 
  width: 100%; 
  padding: 1em 0; 
}

 

 

Obrigado pela ajuda. Resolvemos!