Ciao a tutti,
magari la mia sarà una domanda stupida, ma mi sfugge qualcosa nel modo in cui funzionano i tags
,<h>.
In pratica nel corso si afferma che i tag indicati lasciano una riga vuota prima e dopo di loro.
Tutto bene finche non scrivo ad esempio una cosa simile:
Mi aspetterei, in ossequio a quanto scritto nel corso, che il testo racchiuso nel tagcodice:<div id="frame"> Prima Riga...</p> </div>
sia distanziato dal bordo del div con una riga vuota, cosa che invece non accade.
Come mai?
un elemento a livello di blocco
, <h1> etcc
non può lasciare di default righe vuote prima o dopo.
dov'è che l'hai letto ?
Esattamente :
qui
Si riporta questa definizione:
"Il paragrafo
Il paragrafo è l'unità di base entro cui suddividere un testo. Il tag
lascia una riga vuota prima della sua apertura e dopo la sua chiusura."
ah, ok capito.
parliamo di html generale, non tanto di formattazione della pagina.
il risultato è questo perchè non è stato impostato un css di reset per tutti i tag.
Nel momento in cui si comincia a lavorare su un progetto o anche su una semplice pagina web è importante cancellare tutti gli stili predefiniti della pagina, perchè altrimenti succedono queste cose e puoi avere differenze di visualizzazione fra i diversi browser.
nella fattispecie c'è una riga ogni elemento p o h1 ha un certo valore di margin.
ciao
Grazie! Seguendo il tuo consiglio sono andato nel tutorial CSS e nella lezione delle tecniche CSS di base ho applicato, per prova, il CSS di reset di Eric Meyer, ma lo strano comportamento di
e <h> persiste.
Mi rendo conto che forse questa è una stupidata, tuttavia vorrei capire bene come funzionano i tag.
allego il CSS di Meyer:
codice:html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; }
Ciao,
secondo me, il problema è di browser perché questo codice:
in IE7 si comporta come descrivi tu mentre in FF si comporta correttamente.codice:fuori <div style="border:1px solid red; width:300px;"> testo del paragrafo </p> </div> fuori
Purtroppo non posso uplodare gli screenshot perché il proxy dell'ufficio non me lo permette.
Ciao
La democrazia rappresentativa ha fatto il suo tempo, è ora di passare alla democrazia diretta.
www.beppegrillo.it
Ti ringrazio, ho verificato ed in effetti il problema non si pone per Firefox. Tipo esempio di incompatibilità fra Microsoft e gli standard....
che doctype definition hai impostato ?
Nessno, poichè era solo una prova per verificare il comportamento dei tag ho usato uno schema brutale composto da <html><head></head><body>.....</body></html>Originariamente inviato da StefanoC
che doctype definition hai impostato ?
Effettivamente col doctype non dà più il problema.
Chapeau.
codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> </head> <body> fuori <div style="border:1px solid red; width:300px;"> testo del paragrafo </p> </div> fuori </body> </html>
La democrazia rappresentativa ha fatto il suo tempo, è ora di passare alla democrazia diretta.
www.beppegrillo.it
Permessi di invio
Rispondi quotando