ti trovi sul forum xhtml/css....
quindi presumo tu voglia scrivere codice xhtml!!
...allora per farlo devi usare un DOCTYPE, su cosa è un doctype ti rimando al www.w3c.org
per esempio puoi usare questo:
prima del tag <title>,codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
praticamente al posto di <html>
p.s. in xhtml tutti i tag devono essere minuscoli!
Era il mio cane!
che cosa brutta l'ignoranza!!
Sì ora ho capito cosa intendi per DOCTYPE..normalmente lo metto sempre solo che questa è solo una pagina di prova. Dopo ci devo mettere tutto assieme ai tag <meta> etc..
grazie ancora per i chiarimenti. Sono solo un povero grafico che tenta di imparare a programmare un pochino per quanto possibile..
- - - keep it simple - - -
io uso sempre con successo questo codice su tutti i browser.
qui c'è il codice generico, devi adattarlo alle tue esigenze cioè assegnare i nomi corretti per gli "id" che usi:
body {margin:0px; padding:0px;}
#content {
position:absolute;
left:50%;
width:500px;
margin-left:-255px;
}
La fonte è questa:
http://bluerobot.com/web/css/center2.html
Sullo stesso sito c'è anche un altro metodo per centrare i contenuti:
http://bluerobot.com/web/css/center1.html
Che poi è quello che ti è già stato suggerito e che si avvale del fatto che IE applica "text-align" a livello di blocco (ma funziona anche con gli altri browser).
Il vantaggio a mio parere del metodo che usa i margini negativi è che lo puoi usare anche per centrare un box rispetto all'altezza e non solo rispetto alla larghezza.
In pratica indichi la larghezza con width: 500px (o il tuo valore), la posizione di sinistra con left: 50% e con margin-left: -256px (usa la metà delal tua larghezza, potrebbe esserci 1 px da mettere in più o in meno, c'è una lieve differenza tra browser ma è praticamente insignificante) fai arretrare il box verso sinistra della metà della larghezza. Lo stesso puoi fare con l'altezza usando height, top e margin-top, se vuoi.
Ovvio che #content è il contenitore esterno, quello posizionato a centro pagina, poi dentro devi aggiungere i tuoi 3 blocchi di contenuto vero e proprio (che, ho visto nell'esempio, in realtà non vanno tutti e 3 centrati perchè vanno 1 sulla prima riga e gli altir due sotto ma di fianco, mi è sembrato di capire)
byebye
maurizio
grazie dell'approfondimento..ne terrò presente!!
- - - keep it simple - - -
Si`, questo funziona sulla maggior parte dei browser, ma non e` molto accessibile.Originariamente inviato da mandp
io uso sempre con successo questo codice su tutti i browser.
qui c'è il codice generico, devi adattarlo alle tue esigenze cioè assegnare i nomi corretti per gli "id" che usi:
body {margin:0px; padding:0px;}
#content {
position:absolute;
left:50%;
width:500px;
margin-left:-255px;
}
...
Se hai uno schermo piccolo (pensa ad un palmare), chiaramente il tuo codice fallisce.
La programmazione moderna invita a non usare dimensioni fisse. E questa e` la nostra sfida per i prossimi anni.
MANNAGGIA ... se IE fosse un po' piu` standard non avremmo tutti questi problemi.
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
scusa, sto facenod 3 cose in una, incluso seguire la discussione e mi sa che mi sono perso qualcosa
non avevo in effetti pensato ad un utilizzo su un palmare ma ho dato un occhio al sito e ho cercato una soluzione che in effetti fosse valida per i browser tradizionali.
però perchè dovrebbe fallire su un palmare? se ha uno schermo piccolo il problema potrà essere che non vede i contenuti perchè non è sufficientemente largo, ma il margine negativo è comunque sempre la metà della larghezza e va modificato "a mano" in base ad essa cioè se hai widht: 750px allora margin-left sarà 375px e così via.
byebye
maurizio
la questione, guardano il codice html in questione, è inoltre che ci sono in realtà 3 DIV per cui tre pezzi a livello di blocco per cui la struttura andrà comunque rivista, mi sembra di capire.
nel senso che il primo DIV va in alto ma i successivi vanno sotto e sulla stessa riga.
onde per cui bisognerebbe usare la posizione float se li si vuole affiancare altrimenti dopo ogni DIV il browser va a capo, trattandosi di un blocco.
byeybe
maurizio
Si`, ma se lo schermo e` largo 400 px ti perdi 50 px per lato: non mi sembra una soluzione molto usabile ...però perchè dovrebbe fallire su un palmare? se ha uno schermo piccolo il problema
Invece se usi:
border:0,auto;
max-width: 500px;
ti si centra lo stesso, e in caso di browser stretto vedi comunque tutta la pagina.
Nota: per IE occorre anche mettere text-align:center; nel blocco superiore.
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
gordon, prova questo codice. non è il masismo della vita - come giustamente qualcuno mi farà rilevare- però funziona.
ci sarebbe da mettere a posto la storia del DOCTYPE e dei tag minuscoli, come ti è stato detto, però non avevo purtroppo il tempo di correggere il tutto
guarda che nei Frame ho messo dei riferimenti assoluti per le pagine da caricare, in modo da potere provare la pagina in locale sul mio portatile. ricambia il tutto.
il principio era quello di inserire un contenitore esterno da centrare (ho messo un ulteriore DIV con id="contenitore") e poi usare float:left per la seconda riga di DIV in modo che i due risultino allineati sulla stessa riga. lo standard altrimenti prevede che i tag DIV vadano ognuno su una sua riga.
ecco il codice:
<html>
<head><link rel="STYLESHEET" TYPE="text/css" HREF="stilehome.css"></head>
<STYLE TYPE="text/css">
<!--
body{
margin:0;
padding:0;
text-align:center;
}
#barra {
margin:0 auto;
padding:0;
top:0px;
width:750px;
height:164px;
background-color:#1F1F1F;
overflow:hidden;
border-top: 1px solid yellow;
border-left: 1px solid yellow;
border-right: 1px solid yellow;
}
#menu {
margin:0;
padding:0;
float: left;
width:152px;
height:332px;
background-color:#1F1F1F;
overflow:hidden;
border-left: 1px solid yellow;
border-bottom: 1px solid yellow;
}
#content {
float: left;
margin:0 auto;
padding:0;
left:auto;
top:164px;
width:598px;
height:332px;
background-color:#1F1F1F;
overflow:auto;
border-bottom: 1px solid yellow;
border-right: 1px solid yellow;
}
#contenuto {
width: 750px;
height: 490px;
left: 50%;
margin-top: 0px;
margin-left: 375px;
}
-->
</STYLE>
</HEAD>
<BODY STYLE="background-color:#1F1F1F; overflow:auto; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<DIV ID="contenuto">
<DIV ID="barra">
<iframe src="http://www.suryastones.it/testing/barra.html" width="750" height="164" frameborder="0">
To view this website you need a browser that supports frames.
</iframe>
</DIV>
<DIV ID="menu">
<iframe src="http://www.suryastones.it/testing/menueng.html" width="152" height="332" frameborder="0">
To view this website you need a browser that supports frames.
</iframe>
</DIV>
<DIV ID="content" align="left">
<font class="testo3"><p align=center>SuryaStones | the stones of the sun</p></font><font class="testo"><ul type="circle">[*]Import-Export of stone materials from around the world, directly from the
quarries without the middleman[*]Processing under our supervision at the site of origin in order to lower costs [Joint-Venture in India][*]Buying for third parties [*]Stone building materials [stairs, window-sills, thresholds, floors, wall-facings, etc.] [*]Specialized in the field of urban pavements for streets and town squares of
historical centres [slabs, flagstones, cubes, borders, embrasures, steps, traffic breakers, flower-beds, fountains, etc.][*]Laying of materials by qualified personel, ventilated walls, etc.
[/list]<font color=#C7C7C7>Always attentive to new demands of the market, SuryaStones is able to satisfy your needs with experience and professional skills and to resolve any problems that may arise with the same commitment
<div align=center>Please contact us for estimates and/or for samples of our materials:
<font color=#FFFFFF>
via Valoria Inferiore 31 | 12037 Saluzzo (CN)
tel: +39/0175.217239 | fax: +39/0175.240615
suryastones@libero.it</font>
</DIV>
</DIV>
</body></html>
byeybe
maurizio
mhm.. scusa l'ignoranza ma con max-width praticamente il browser mi fa un autoresize del sito? Ossia che, ad esempio, se io facessi una pagina ottimizzata a 1280x1024 (sarebbe una cazzata ma ipotiziamo..) e mettessi max-width:1200 e poi qualcuno va a vederla con uno schermo settato a 800x600 la pagina gli si ridimensiona automaticamente alle dimensioni del suo browser? Immagini incluse??
- - - keep it simple - - -
Permessi di invio
Rispondi quotando