[CCS] - Aiuto per #divs

[cicciofarmaco]

Salve gente, sto cercando di realizzare la versione on line di un periodico d'informazione gestito da conoscenti. Ho visionato un bel po di siti del genere, ed ho eleborato la mia anteprima. Purtroppo non riesco ad realizzare ed a farli apparire in maniera corretta i divs #table_main_dx, #table_submain_1, #table_submain_2 e #table_submain_3. Chiedo a qlc guru dei css, se mi è consentito, di aiutarmi a realizzare qst progetto, di cui di seguito posto la screenshot:



Grazie in anticipo, come sempre!

[cicciofarmaco]

Sono riuscito ad ottenere grosso modo quanto intendevo fare. Ho un problema però, su IE ed Opera la visualizzazione dei tre divs accanto l'immagine è come auspicata, mentre su FF il terzo div, in ordine di successione, appare sotto. A cosa può ricondursi qst errore di visualizzazione e come potrei risolverlo? Grazie..

Link di riferimento

[serialkiller]

anche se non sono un guru, 10 a 1 è un problema di box model

http://css.html.it/articoli/leggi/34...l-box-model/1/

e

http://css.html.it/articoli/leggi/45...emi-dei-css/1/

in più, come mi semra sia anche spiegato in uno dei due articoli, mettendo una DTD 1.0 strict, risolvi parecchie magagne.

[cicciofarmaco]

Azz..non riesco proprio a sistemare qst situazione dei tre divs accanto all'immagine. Sono rispettivamente:

#table_submain {
  width: 142px;
  height: 257px;
  background-color: #fff;
  margin: 0 2 0 2px;
  padding: 0 2 0 2px;
  float: left;
  }
  
#table_submain_1 {
  width: 142px;
  height: 257px;
  background-color: #fff;
  margin: 0 2 0 2px;
  padding: 0 2 0 2px;
  float: left;
  }

#table_submain_2 {
  width: 142px;
  height: 257px;
  background-color: #fff;
  margin: 0 2 0 2px;
  padding: 0 2 0 2px;
  float: left;
  }

inseriti dentro il div

#table_main_dx {
  width: 450px;
  height: 257px;
  background-color: #fff;
  margin: 0 0 0 0px;
  padding: 0px; 
  float:left;
  }

Non capisco il motivo per cui qst tre divs appaiano allineati a sx, mentre secondo le impostazioni del css dovrebbero apparire al centro. Infatti tra width, padding e margin raggiungono i 450 px, che è la la larghezza assegnata al div #table_main_dx, entro cui sono contenuti.

Help me please..

[cicciofarmaco]

Gente, ho risolto il problema della visualizzazione a sx dei tre divs #table_submain. Il problema era dovuto al fatto che mettevo

margin: * * * *px

al posto di

margin: *px *px *px *px

Adesso ho un altro problema (..vedi che novità!). In pratica in IE il terzo #table_submain mi si visualizza sotto agli altri due, e non accanto, comme avviene in FF ed Opera. Ho provato ad inserire nel css il codice per correggere il bug del box model in IE, ma il problema persiste.

Vi posto il css

#table_submain {
  width: 142px; 
  height: 253px;
  background-color: #fff;
  margin: 2px 2px 2px 2px; /*ie margin right: -3px; */
  padding: 0px 2px 0px 2px;
  float: left;
  }

link di riferimento

Spero che qlc si commuova e mi risponda..visto i precedenti!

[panta1978]

Originariamente inviato da cicciofarmaco
Adesso ho un altro problema (..vedi che novità!). In pratica in IE il terzo #table_submain mi si visualizza sotto agli altri due, e non accanto, comme avviene in FF ed Opera. Ho provato ad inserire nel css il codice per correggere il bug del box model in IE, ma il problema persiste.

link di riferimento

Spero che qlc si commuova e mi risponda..visto i precedenti!

Penso che il problema sia dovuto al fatto che IE non interpreta correttamente l'attributo width dei div e delle tabelle.

Due soluzioni:

1) Usare i commenti condizionali, se fai una ricerca sul forum trovi tutte le informazioni utili, comunque intendo qualcosa del tipo:

2) Usare come DTD XHTML1.0-Strict oppure XHTML1.1, che fanno "rigare dritto" quel discolaccio do IE.

Meglio la seconda, secondo me.

[cicciofarmaco]

2) Usare come DTD XHTML1.0-Strict oppure XHTML1.1, che fanno "rigare dritto" quel discolaccio do IE.

Non ho ancora capito quali siano le differenze concrete, visto ke ho letto mille e più guide sul DTD, tra HTML ed XHTML, e poi tra i vari transitional e strict.
Ad esempio se mettessi <DTD XHTML1.0-Strict ....> al posto della mia <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> dovrei cambiare modo di scrivere il codice della pagina, suppongo. In cosa si differenzia l'XHTML dall'HTML tradizionale?

[panta1978]

Originariamente inviato da cicciofarmaco
Non ho ancora capito quali siano le differenze concrete, visto ke ho letto mille e più guide sul DTD, tra HTML ed XHTML, e poi tra i vari transitional e strict.
Ad esempio se mettessi <DTD XHTML1.0-Strict ....> al posto della mia <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> dovrei cambiare modo di scrivere il codice della pagina, suppongo. In cosa si differenzia l'XHTML dall'HTML tradizionale?

Guardati le guide di XHTML e HTML presenti su questo sito! Le trovi al seguente url: http://xhtml.html.it/

Comunque sì, ci sono alcune piccole differenze fra scrivere in HTML ed in XHTML. Nel passaggio da Transitional a Strict vengono eliminati molti tag, quali center, font, eccetera, ed al loro posto si impone di usare il css. Quindi, se vuoi usare una DTD Strict, devi conoscere anche il CSS.

[cicciofarmaco]

Diciamo che ormai a grandi linee i css ho imparato a conoscerli. Mi ci sbatto la testa da un bel po di mesi ad ora, per cui non dovrei avere grossi problemi! Speriamo bene..

[cicciofarmaco]

Guarda il codice. Adesso ho usato

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">

ma il problema non si è risolto!