[Resolvido] div adaptável

[pinoc 2]

Boa tarde.

 

Preciso fazer o seguinte, não tenho muita noção com JS

 

Tenho o seguinte codigo.

 

<div id="nots">
    <div id="nots-img">
          <img src="banner/imgnoti.jpg" width="75" height="75" />
    </div>
    <div class="nots-text">
           Noticia Noticia Noticia Noticia Noticia Noticia Noticia Noticia Noticia.. Saiba +
    </div><!-- NOTS-TEXT -->
</div><!-- NOTS -->      

 

 

Como fazer apara a class NOTS-TEXT se adaptár ao tamanho total da div NOTS quando não aver a div NOTS-IMG?

 

Obrigado.

[Ismaeldm 5]

Boa tarde.

 

Preciso fazer o seguinte, não tenho muita noção com JS

 

Tenho o seguinte codigo.

 

<div id="nots">
    <div id="nots-img">
          <img src="banner/imgnoti.jpg" width="75" height="75" />
    </div>
    <div class="nots-text">
           Noticia Noticia Noticia Noticia Noticia Noticia Noticia Noticia Noticia.. Saiba +
    </div><!-- NOTS-TEXT -->
</div><!-- NOTS -->      

 

 

Como fazer apara a class NOTS-TEXT se adaptár ao tamanho total da div NOTS quando não aver a div NOTS-IMG?

 

Obrigado.

 

Isso nem é por JS, basta colocar no CSS assim:

 

.nots-text {

width: 100%;

height: auto;

}

 

E pronto ^^

Com imagem ou sem imagem ela sempre estara do tamanho correto

[pinoc 2]

Não funcionou apenas colocando 100% a class continua em baixo e não ao lado como eu preciso.

[pinoc 2]

Resolvido :D

 

XHTML

 

<div id="nots">
    <img src="banner/imgnoti.jpg" width="75" height="75" style="float: left; margin: 0 5px 5px 0;" />
         <div class="nots-text" >
             20/04/2012 - Abertas inscrições para o vestibular da UDESC não perca tempo..  Saiba +
         </div><!-- NOTS-TEXT -->
         <div id="nots-separa"></div><!-- NOTS-SEPARA -->
         <div class="nots-text">
             20/04/2012 - Abertas inscrições para o vestibular da UDESC não perca tempo..  Saiba +
         </div><!-- NOTS-TEXT -->
</div><!-- NOTS -->      

 

CSS

#nots {
width: 273px;
height: 75px;
display: table;
margin-top: 5px;
}

#nots .nots-text {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight:normal;
color: #8c8b8b;
width: 100%;
padding: 5px;
text-align: justify
}  

#nots #nots-separa {
background: url(../img/separa-nots.jpg) no-repeat;
height: 2px;
width: 282px;
clear: both;
margin: 5px 0;
}