CSS propriedade de largura mínima não está funcionando
Tenho o seguinte problema:
Eu tenho div contendo outros elementos e tento tornar sua largura dependente do conteúdo. Também restrito a largura máxima dessa div. Eu usomin-width
emax-width
em CSS, mas parece quemin-width
não está funcionando. A largura de div é sempre omax-width
valor, não importa qual seja o conteúd
Exemplo
Eu gostaria de ter a div branca (que é a div principal, eu estava falando) estritamente ao redor da forma que está nela, sem espaços vazios no lado esquerdo e direito. Eu dei o estilo de formuláriomax-width:500px
para mostrar que, mesmo que o conteúdo seja pequeno, a div principal permanece a mesm
HTML
<div class="gInnerBox sInnerBoxMain">
<form style="max-width:500px; margin-left: auto; margin-right: auto">
<div id='content'>
<!-- CONTENT -->
</div>
</form>
</div>
CSS
.gInnerBox{
position: relative;
background-color: #fff;
opacity: 0.9;
padding: 10px 10px 10px 10px;
box-shadow: -5px -5px 20px #000, 5px 5px 20px #000;
-moz-box-shadow: -5px -5px 20px #000, 5px 5px 20px #000;
-webkit-box-shadow: -5px -5px 20px #000, 5px 5px 20px #000;
border: 1px solid #000;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
.sInnerBoxMain{
max-width: 1000px;
min-width: 500px;
margin-left: auto;
margin-right: auto;
top: 50px;
}