Newsgroup: it.lavoro.professioni.webmaster
Titolo: Mi date un aiutino con questo codice HTML?

Sto diventando un po' matto penso per una sciocchezza. In allegato qui
sotto il codice.
Il problema è questo. Io vorrei avere il risultato grafico del "caso
2", quindi prima riga della descrizione sulla stessa riga del titolo e
quando la descrizione va a capo sia allineata (ma stia sempre a destra
del titolo), anche nel "caso 3", cioè quando il titolo è molto lungo e
non ci sono più i 400px per la descrizione. Chiaramente per risolvere
sarebbe sufficiente forzare la larghezza del titolo, ma questo non lo
posso fare. Il titolo dev'essere "fluido" e la descrizione deve
iniziare sempre da dove finisce il titolo,questo perchè a volte il
titolo è molto lungo ma la descrizione è molto corta.
Si può fare in qualche modo?
<style type="text/css" media="all">
.totale{
   width:               400px;
   background-color:    #ff0000;
}
.titolo{
   background-color:    #00ff00;
   float:               left;
}
.descrizione{
   background-color:    #0000ff;
   float:               left;
   width:               300px;
   color:               #ffffff;
}
.clear-both{
   clear:               both;
}
</style>
<div>Caso 1</div>
<div class="totale">
   <div class="titolo">Titolo:</div>
   <div class="descrizione">Descrizione</div>
   <div class="clear-both"></div>
</div>
<div><br />Caso 2</div>
<div class="totale">
   <div class="titolo">Titolo:</div>
   <div class="descrizione">Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione </div>
   <div class="clear-both"></div>
</div>
<div><br />Caso 3</div>
<div class="totale">
   <div class="titolo">Titolo Titolo Titolo Titolo Titolo Titolo :</
div>
   <div class="descrizione">Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione </div>
   <div class="clear-both"></div>
</div>

Dimenticavo una cosa MOLTO importante. Se si toglie
 width:               300px;
dalla classe descrizione in ie funziona tutto esattamente come vorrei,
ma ni chrome e in ff no e tutto deve funzionare con tutti e 3 i
browser
Grazie

 lungo ma la descrizione è molto corta. Si può fare in qualche modo?
No.
Puoi aggirarlo con javascript, ma non con HTML e CSS da soli.
Bye.

prova con le percentuali sulla larghezza, ad esempio:
.titolo{
   background-color:    #00ff00;
   float:               left;
   width:               30%;
}
.descrizione{
   background-color:    #0000ff;
   float:               left;
   width:               70%;
   color:               #ffffff;

 Puoi aggirarlo con javascript, ma non con HTML e CSS da soli.
javascript mi è molto antipatico :-/
Grazie!

> prova con le percentuali sulla larghezza, ad esempio:
No... non funzia.
Grazie Comunque

 javascript mi è molto antipatico :-/
E` un po' musone, ma quando lo conosci lo apprezzi, fidati. :)
Magari fai amicizia anche con jQuery e vedrai che insieme sono anche 
meglio. ;)
Bye.

 meglio. ;)
JQuery suona femminile.... forse mi piacerà di più di javascript... he
he he
Grazie

ce l'ho fatta. Ecco come fare
.tot{
   width:               400px;
}
.primo{
   background-color:    #ff0000;
   float: 		left;
}
.secondo{
   background-color:    #00ff00;
   width:               120px;
}
.terzo{
   background-color:    #0000ff;
   color:               #ffffff;
}
<div class="tot">
<div class="primo">
<div class="secondo">
Titolo Titolo Titolo Titolo Titolo Titolo
</div></div>
<div class="terzo">DDescrizione Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione Descrizione escrizione Descrizione
Descrizione Descrizione Descrizione Descrizione Descrizione
Descrizione DDescrizione Descrizione Descrizione Descrizione
Descrizione Descrizione Descrizione Descrizione escrizione Descrizione
Descrizione Descrizione Descrizione Descrizione Descrizione
Descrizione
</div>
<div class="clear-both"></div>
</div>
Buona serata