Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa tarde pessoal, novamente estou aqui pedindo ajuda.
Seguinte: estou com um problema em controlar duas divs no conteudo.
No lado direito tenho uma div1 com os seguintes atributos na tag
style:
padding:10px; width:350px; min-height:220px;
e no lado direito(div2), que é onde se encontra o problema:
position:relative;
left: 380px;
top: -242px;
width: 555px;
min-height: 240px;
font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1.1em;
border: 1px solid #dddddd; background: #eeeeee; color: #333333;
eu gostaria de deixar uma ao lado da outra ex:
div1 espaçamento div2, e se a div 1 aumentar a div 2 ficar paradinha na dela.
porém isso nao esta dando certo
DIV 1 é de JQuery, vja o css dela:
.ui-widget { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1.1em;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1em; }
.ui-widget-content { border: 1px solid #dddddd; background: #eeeeee; color: #333333; }
.ui-widget-content a { color: #333333; }
.ui-widget-header { border: 1px solid #e78f08; color: #ffffff; font-weight: bold; }
.ui-widget-header a { color: #ffffff; }
.div1 {
float: left;
width: 250px;
background-color: #F00;
margin-right: 10px;
}
.div2 {
width: 550px;
background-color: #FF0;
}
não se esqueça de colocar no elemento que vier após a div2 um
clear: both;
Opa, então, eu já tinha conseguido arrumar antes de ver o tópico aqui.
utilizei float.
Mas agora surgiu um outro problema.....
=(
seguinte:
qndo arrumei o problema que estava dando, a div2 simplesmente jogou todo o texto para a direita, e eu nao consigo coloca-la no lado esquerdo nem utilizando o comando text-align:left;
ele esta mais ou menos assim:
-------------------------------------
| texto|
-------------------------------------
e nao consigo coloca-lo assim:
-------------------------------------
|texto |
-------------------------------------
veja meu codigo:
<div id="conteudo">
<div class="demo">
<div id="accordionResizer" style="padding:10px; width:350px; min-height:220px; float:left;" class="ui-widget-content">
<div id="accordion">
<h3><a href="#">Programações</a></h3>
<div>
<ul>
<li>EBA</li>
</ul>
</div>
<h3><a href="#">Section 3</a></h3>
<div>
Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
</ul>
</div>
</div>
</div>
<div id="teste">
asdasd as asd as as asdas dasd sdf sd sdfsdf <--- aqui que esta errado.
</div>
</div>
</div>Não que tenha jogado para direita, mas é que você não está conseguindo ver como realmente está ficando. Aplique um CSS background para ver o posicionamento. ;)
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Pior que não Thiago, esta tudo beleza, somente o texto esta para lá->, como se tivesse uma figura ali <-, mas nao tem.
isso é meu código:
<div id="teste">
asdasd as asd as as asdas dasd sdf sd sdfsdf
</div>Pessoal, consegui arrumar, peguei a div q tava lá --> e coloquei pra cá <--, e q estava pra cá <-- coloquei pra lá -->. E funcionou, mas eu nao sei o pq...
=/
Escreva sempre seu HTML na ordem em que o elementos se encontram, de cima para baixo, da esquerda para a direita.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Trabalhe com float.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif