Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Como está:
/applications/core/interface/imageproxy/imageproxy.php?img=http://img697.imageshack.us/img697/6861/postju.png&key=46db38212160a416118b09020c479dca302a72fbdfe9e56e3a9e17958ec3fcee" alt="Imagem Postada" />
Como deveria ficar:
/applications/core/interface/imageproxy/imageproxy.php?img=http://img265.imageshack.us/img265/2576/post2g.png&key=38f659d4f62726feb76c2115cd4447e7b63c400297bab51acec8968d038518bc" alt="Imagem Postada" />
CSS
body {
background-image: url('http://i973.photobucket.com/albums/ae214/Holtevs/fundo.gif');
margin: 0;
padding: 0;
font-family: Verdana, Geneva, sans-serif;
}
#tudo {
margin: 10px 50px;
} background-color: #FFF;
border-bottom: 1px solid #900;
padding: 3px;
margin: 10px 0;
color: #900;
font-size: 16px;
clear: both;
} content:".";
display:block;
clear:both;
visibility:hidden;
height:0;
overflow:hidden;
} background-color: #FFF;
border-top: 1px solid #900;
padding: 5px;
}
#post {
float: left;
margin-right: 10px;
clear: left;
}
#menu {
width: 200px;
float: right;
clear: right;
}<body>
<div id="tudo">
<div id="topo"></div>
<div id="cont">
<div id="post"></div>
<div id="menu">
A<br />A<br />A
</div>
</div>
<div id="foot"></div>
</div>
</body>
Já não encontro solução, a div post deveria crescer o máximo para a direita até chegar na div menu, a div menu tem width fixo, e a post deveria ocupar tudo o que sobrar de espaço dentro da div cont;Desde já, Obrigado ;)
Thanks, acredito que seja assim mesmo, não estou com o código aqui, mas logo que eu chegar em casa já testo ;)
Poxa não deu certo aqui, eu não quero um tamanho fixo para minha própria comodidade, porquê uso 1440x900 de resolução e o padrão seria fazer para uma 1024x768, dai ficaria um espação que não acho legal.
Olha como ficou o CSS, o HTML continuou igual
body {
background-image: url('http://i973.photobucket.com/albums/ae214/Holtevs/fundo.gif');
margin: 0;
padding: 0;
font-family: Verdana, Geneva, sans-serif;
}
#tudo {
margin: 10px 50px;
} background-color: #FFF;
border-bottom: 1px solid #900;
padding: 3px;
margin: 10px 0;
color: #900;
font-size: 16px;
clear: both;
} content:".";
display:block;
clear:both;
visibility:hidden;
height:0;
overflow:hidden;
} background-color: #FFF;
border-top: 1px solid #900;
display: inline-block;
}
#post {
margin-right: 10px;
float: left;
width: auto;
}
#menu {
width: 200px;
float: right;
}Beleza.
Como eu disse , caso quisesse que a DIV se ajustasse ao tamanho sozinha para usar o width:auto.. XD
Ficou bom.
_
Realmente como falaste, o padrão é usar uma width determinada para 1280 /1024 mas não vejo problema em utilizar uma width automática (estando dentro de um container definido ) .
Bons estudos.
;)
>
Poxa não deu certo aqui
Não consegui resolver ainda...
Veja a página de login do orkut... Quando tu redimensiona horizontalmente só a div da esquerda redimensiona, seria o mesmo esquema que desejaria montar :S
Holt, remova esta linha:
>
display: inline-block;
>
Holt, remova esta linha:
Tá e agora
Ainda não surtiu o efeito desejado :/
PS: a página do orkut que citei é a do login do .com.br (com fundo azul) não do .com
* { margin: 0; padding: 0; }
div { border: 1px solid #000; }
.maior { clear: both; margin-right: 220px; }
.menor { float: right; margin: 0 10px; width: 200px; }
<div class="menor">A div que flutua à direita deve vir PRIMEIRO</div>
<div class=maior">Seguida da div maior de largura variável</div>>
* { margin: 0; padding: 0; }
div { border: 1px solid #000; }
.maior { clear: both; margin-right: 220px; }
.menor { float: right; margin: 0 10px; width: 200px; }
<div class="menor">A div que flutua à direita deve vir PRIMEIRO</div>
<div class=maior">Seguida da div maior de largura variável</div>Com algumas adaptações obtive o resultado desejado
Obrigado chará Também me chamo Evandro
Para quem estiver procurando o mesmo efeito, veja como ficou o código:
CSS
* {
margin: 0;
padding: 0;
} background-image: url('http://i973.photobucket.com/albums/ae214/Holtevs/fundo.gif');
padding: 10px 50px;
font-family: Verdana, Geneva, sans-serif;
} background-color: #FFF;
border-bottom: 1px solid #900;
padding: 3px;
margin: 10px 0;
color: #900;
font-size: 16px;
clear: both;
} background-color: #FFF;
border-top: 1px solid #900;
padding: 10px;
}
#post {
margin-right: 230px;
}
#menu {
width: 200px;
float: right;
clear: both;
}HTML
<body>
<div id="topo"></div>
<div id="cont">
<div id="menu">
A<br />A<br />A
</div>
<div id="post">
A<br />A<br />AA<br />A<br />A
</div>
</div>
<div id="foot"></div>
</body>
Beleza Holt?
Amigo..
ta ai o seu código.
Só explicando,
nenhum tag com exceção de Table (odilho* XD) cresce para os lados .
Portanto deve-se sempre definir a width do elemento ao menos.
caso você queira que a width se ajuste ao tamanho então deve colocar:
width:auto; / assim ele se ajusta ao tamanho necessário para preencher o espaço que sobrou / } </style> Porém, colega, não recomendo usar tamanhos ajustáveis em qualquer tipo de estrutura. Pode perceber pelo próprio site da Imasters foruns, que se você diminui a janela o site'encolhe' e fica tudo bugado.
Bem acredito que a solução é simples ,amigo:
Determine a width do seu site depois de cada div, assim ele ficará sempre de mesma largura.
Caso o conteúdo seja variável e possa variar a quantidade de caracteres , ocorrendo um suposto overflow,
coloque as divs com width determinada , como falei antes, e coloque apenas a height com width auto;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
body {
margin:auto / isso coloca a página no centro da janela SEMPRE /
}
margin:auto / isso coloca a página no centro da janela SEMPRE /
}
#topo, #foot{
#cont:after {
#post, #menu {
.botao:hover {
TutorialDePHP - Tutoriais em geral de PHP e MySQL
Autor: Evandro Sasse Holtevs
bom..é isso ai.. fiz algo meio rápido ai pra você.
espero que de pra usar .. KKK..
abraço