Newsgroup: it.comp.www.html
Titolo: Html e css question :)

Allora
Problema facile facile per voi
Ho un DIV fatto con i css nell'head
 <div id="head02">
    <!-- inizio head02 -->
    <div align="left">
 Login
 Registati
 <span align="right">Ultima modifica : 17-07-2003</span>
 </div><!-- fine head02 -->
Cosa voglio...
Dunque avete presente i siti che hanno un rettangolino con scritto a
sinistra
LOGIN REGISTRATI e SEMPRE sulla stessa linea a destra "Ultimo aggiornamento
: eccccc"
Ok di solito loro lo fanno dinamicamente.. io non so e non ho tempo per
farlo.
Ragion per cui .. come si fa!?!
se metto SPAN non permette di mettere align="right"   - infatti l'esepmio č
sbagliato perchč non funziona :)
Se metto <p> mi fa LOGIN E REGISTRATI su una riga a sinistra e "Ultimo
aggiornamento" su quella sotto a destra
Se faccio <DIV> lo stesso di <P>
Soluzione per metterli nella stessa riga LOGIN e REGISTRATI a sinsitra e
ULTIMO AGGIORNAMNETO a destra?
Danke!
Ric.

 sbagliato perchč non funziona :)
Ovvio, i <div> sono elementi block.
Invece che <div align="left"> prova a fare <div id="left">
Poi nel css definisci #left e #head02 come float: left
Salvo altri div che non hai riportato dovrebbe funzionare.
Deep

Ric ha scritto:
| Allora
| Problema facile facile per voi
[...CUT...]
| Dunque avete presente i siti che hanno un rettangolino con scritto a
| sinistra
| LOGIN REGISTRATI e SEMPRE sulla stessa linea a destra "Ultimo aggiornamento
| : eccccc"
| Soluzione per metterli nella stessa riga LOGIN e REGISTRATI a sinsitra e
| ULTIMO AGGIORNAMNETO a destra?
Ciao Ric,
    l' attributo align è deprecato, e la cosa si può fare con un float di uno span.
L' unica cosa è che gli elementi "floattanti" nell' html vanno dichiarati
prima degli altri che seguono il flusso normale, per questo forse uno stile inlinea
con la proprietà float è più adeguato in quanto ricorda che l' elemento è float
nell' html.
Altra cosa da dire e che gli span, essendo elementi in-line, possono contenere
solo altri elementi in-line (per esempio <a>, <span> e <img>).
Se però vuoi rendere float un div, essendo un block-level element,
questo prenderà l' intera larghezza del suo container se non specificato altrimenti
(per questo credo che la soluzione proposta da DeepBlue non vada).
Quindi per rendere float un div in un altro div dovrai dimensionarlo e
scrivere qualcosa del tipo:
<div>
    <div style="width: 200px; float: right">
        <p>Questo testo comparirà a sinistra e in questo div ci posso mettere tutto,
            non solo elementi in-line.
        </p>
    </div>
    <p>Testo a destra</p>
</div>
Qui di seguito c'e' una paginetta di esempio completa che usa il float di uno span
che va bene se devi solo scrivere a destra "ultimo aggiornamento: ..."
Saluti,
    SantaKlauss
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd
">
<html>
<head>
<title>Floating text to right in div</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 2.6">
<style type="text/css">
div#linediv{
    width: 80%;
    background-color: #ddd;
    color: #000;
    border-bottom: 5px solid #000
    }
div#linediv p{
    padding: 2px;
    font-family: arial,verdena,sans-serif;
    font-size: 10pt;
    font-weight: bold
    }
div#linediv p span{
    font-weight: normal
    }
</style>
</head>
<body>
<div id="linediv">
    <p>
        <span style="float: right">Ultimo aggiornamento: 19 Luglio 2003</span>
        Area Login
    </p>
</div>
</body>
</html>

 (per questo credo che la soluzione proposta da DeepBlue non vada).
[cut]
No, se dichiari un <div> come float senza specificare un width, questo
prenderà le dimensioni di ciò che contiene. Per cui, a meno di specificare
width e padding, due div float saranno affiancati e occuperanno lo spazio
minimo necessario.
Concordo cmq che sia preferibile dare una dimensione al div, ma pensavo che
fosse sottointeso visto il tipo di problema di Ric :)
Deep

DeepBlue ha scritto:
| No, se dichiari un <div> come float senza specificare un width, questo
| prenderŕ le dimensioni di ciň che contiene. Per cui, a meno di specificare
| width e padding, due div float saranno affiancati e occuperanno lo spazio
| minimo necessario.
Grazie, č una cosa che non sapevo. Il sito 
www.brianjar.com
 riporta:
There are a few things you should note regarding floated boxes.
For one, the box being floated should have a width defined for it,
either explicitly or implicitly. Otherwise, it will fill its containing block
horizontally, just like non-floated content, leaving no room for other
content to flow around it. As such, floated boxes are always treated
as block boxes, even if they are defined using inline elements.
Ho fatto una prova, ovvio che se si tratta di scrivere solo
"Ultimo agg...." si rientrebbe nel caso di "dimensionamento implicito"
in quanto quasi sicuramente, a meno dell' uso di un font-size enorme,
dovrebbe starci su una riga insieme al resto.
Saluti,
    SantaKlauss
** Segue il codice di test **
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd
">
<html>
<head>
<title>Sans Titre</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 2.6">
<style type="text/css">
div#linediv{
    width: 80%;
    background-color: #ddd;
    color: #000;
    border-bottom: 5px solid #000
    }
p{
    padding: 5px;
    font-family: arial,verdena,sans-serif;
    font-size: 10pt;
    font-weight: bold
    }
</style>
</head>
<body>
<div id="linediv">
    <div style="float: right; border: 1px solid #f00">
        <p>Ultimo aggiornamento: 19 Luglio 2003</p>
    </div>
    <p>Area Login</p>
</div>
</body>
</html>

 ** Segue il codice di test **
[cut]
E infatti anche il tuo codice conferma quanto detto da me prima.
Allora pongo di nuovo la questione: sono io che non ho capito cosa intende
brianjar.com
, brianjar ha sbagliato o sono i browser che non interpretano
correttamente il css ?
Deep, ora dubbioso

DeepBlue ha scritto:
| Ok, premesso che il mio inglese è un po' arrugginito vorrei fare dei
| commenti, perchè mi sa che non ho capito cosa c'è scritto oppure è sbagliato
| (oppure siamo alle solite: i browser interpretano i CSS come vogliono loro)
Ciao Deep,
    anche il mio inglese non è dei migliori. In sostanza dice che se la larghezza implicita
è pari al 100% l' elemento non verrà reso float. Ecco qui:
" There are a few things you should note regarding floated boxes.
For one, the box being floated should have a width defined for it,
either explicitly or implicitly. Otherwise, it will fill its containing block
horizontally, just like non-floated content, leaving no room for other
content to flow around it. As such, floated boxes are always treated
as block boxes, even if they are defined using inline elements."
"Ci sono alcune cose da considerare riguardo ai box floattanti.
Primo, il box che andrà messo float dovrebbe avere una larghezza definita,
sia implicitamente che esplicitamente. Altrimenti riempirà il suo containing block
orizzontalmente, come se non fosse float, non lasciando spazio per fluttuare
agli altri contenuti. Inoltre, i box floattanti sono sempre trattati
come block box, anche se sono definiti usando elementi inline."
Sembra quasi una traduzione di babelfish :o)
In sostanza se avessi una cosa del tipo:
<body style="font-family: georgia, serif; font-size: 12pt">
<div style="border: 1px solid #000;padding: 10px">
    <div style="float:right; border: 1px dotted #000">
        <p>I Marziani conoscono la fisica quantistica. Oppure perché le sonde
            Vikings I e II e Mars Pathfinder hanno trovato solo rocce e sabbia rossa
            in un deserto disabitato di un mondo che pullula di vita estremamente intelligente?
        </p>
    </div>
    <p>I Marziani sono a metà strada tra la religione e la scienza terrestre, ma non sono né
        una cosa né l'altra. Sia la scienza che la religione separano il soggetto dall'oggetto.
        I Marziani no. Il metodo scientifico -così come lo si conosce sulla Terra- separa, ad
        esempio, l'osservatore dal fenomeno, dando per scontata la premessa che il fenomeno
        sia qualcosa che esiste di per sé...
    </p>
</div>
</body>
Il div non resterà sicuramente float, in quanto la sua dimensione implicita è il 100%, dato che
il paragrafo in esso contenuto è costituito sicuramente da più linee.
Questo è quanto ho capito... se invece del div che voglio rendere float dichiaro una dimensione
esplicita, fa quello che mi aspetto: resta float.
Saluti,
    SantaKlauss
P.S: è giusto citare la fonte del testo usato per l' esempio,
una delle cose più curiose e deliranti che abbia mai letto in rete:
http://quantum_mars.tripod.com/italiano.htm#mirror%20sites

 
http://quantum_mars.tripod.com/italiano.htm#mirror%20sites
Spero di leggerlo presto: è da ieri notte che con Fastweb non si riescono a
raggiungere molti siti :(
Deep, che si è perso nelle precisazioni :P