Problema visualizzazione tabelle

[SalSal]

Utilizzo una versione modificata del template novagodina. Visualizzo per bene i contenuti e i titoli, ma le tabelle delle sezioni non ci vogliono stare e vanno a finire appena dopo il menu principale che si trova a destra.
Novagodina è un template a CSS.  Qualcuno mi sa dare una spiegazione?

[carloernesto]

ciao,
non conosco il template, chi l'ha modificato?  con tutti i browser la visione non è corretta?
se è un template a div, può essere che non si sia tenuto conto dei diversi allineamenti dei vari div
devi dare più info
magari img e template modificato
ciao

[SalSal]

Si il template è a div. Fosse stato a tabelle avrei potuto gestire meglio, ma mi piaceva troppo. (Fra l'altro, esiste un modo, anche se lo so che è da barbari abbandonare i div, per trasformare un template a div in uno a tabelle?)

Le immagini non rieso a mandarle, ma se vuoi ti sottopongo i sorgenti che ho modificato io.

Comunque tento di spiegarlo. 2 Header, uno per il nome del sito e uno per immagini varie, 2 menu orizzontali, Corpo a sinistra e barra per i menu a destra, footer. L'originale aveva solo header, corpo, barra a dx e footer. Il problema reale è che i contenuti e i blog li visualizza correttamente, ma quando si tratta di tabelle neanche a parlarne. Nel corpo visualizza il titolo della categoria, ma la tabella la allinea appena finiti i contenuti nella banda a dx, tanto che ho dovuto ridurre all'osso i menu a dx per far sembrare meno possibile lo stacco. Ho provato a ridurre la larghezza delle tabelle dal foglio di stile, ma per ora solo nebbia.
Spero di essere stato chiaro.
Grazie per l'aiuto.

P.S. Ma può essere possibile che lo sfondo di un CSS a div si sovrapponga al testo e lo oscuri? Grazie anche per questa risposta.

[giak]

mi posti il link del template? posta inoltre le differenze che noti aprendo il sito sia con ie che con Firefox. Se e' come penso (anche non conoscemdo il tempate) la soluzione potrebbe essere minimna e semplice

[SalSal]

Il css da me modificato (e che sto studiando da poco i css) è questo:


body {
    font-family: sans-serif;
    background: #f6f0dd;
    padding: 0;
    margin: 0;
}

h1 { margin: 0; padding: 1em 0; }
h2 { font-size: medium; margin: 0; padding: 1em 0 0 0; }
h2.date { font-size: x-small; color: #aaa; padding: 0; }
.sidebar h2 { background: white; font-size: small; padding: 0.25em; border-top: 1px solid #eee; }
.sidebar h3 { font-size: x-small; padding: 0; }

p { line-height: 150%; }

acronym { cursor: help; border-bottom: dashed 1px; }

input, select {
    background: #f2f2f2;
    border: 1px gray solid;
}
input:hover { background: white; }

input.button {
    background: #ccc;
    border: 1px gray solid;
}



img {
    border: 0px none;
}


hr { border: 1px gray solid; margin: 1em 12em; }

div#master {
    width: 45em;
    margin: 0 auto;
    border-left: #444 solid thin;
    border-right: #444 solid thin;
    background: #444;
}


#header1 {
   color: white;
   background: url(../images/logo1.gif) bottom left no-repeat;
   background-color: White;
}
 
#header {
    color: white;
    /*background: url(../images/logo.gif) bottom right no-repeat;*/
}

ul#menu {
   margin: 0;
   padding: 0;
   list-style: none;
   text-align: left;
   background: #959595;
}

ul#menu2 {
   margin: 0;
   padding: 0;
   list-style: none;
   text-align: left;
   background: #959595 url(../images/headerBK.gif) repeat-x top;
   font-size: 12;
}

ul#menu li {
    float: left;
    background: transparent url(../images/menustrelica.gif) no-repeat left;
    padding-left: 10px;
}

ul#menu li a {
    display: inline;
    padding: 0.5em 0;
    font-size: small;
    color: #aaa;
    font-weight: bold;
    text-decoration: none;
    margin: 4px;
}
ul#menu li a:hover {
color: white;
}


a:link { color: #921609; text-decoration: none; }
a:visited { color: #921609; text-decoration: none; }
a:link:hover { text-decoration: underline; }
a:visited:hover { text-decoration: underline; }

#content {
    background: white;
    border-top: #eee solid 1em;
    font-size: small;
    color: #444;
    text-align: justify;
    padding: 1em 0;
}

div.item {
    margin: 0 15em 0 1em;
    border-bottom: #eee solid 1px;
    border-right: #eee solid 1px;
    padding: 0 1.5em 0 1em;
}


div.sidebar {
    border-left: solid thick #921609;
    background: #eee;
    width: 14em;
    float: right;
    margin: 0 1px 1em 0; !important
    margin-bottom: 0;
    color: #777;
    clear: both;
}

div.sidebar a { font-size: x-small; }
div.sidebar p { font-size: x-small; margin: 1em; }
div.sidebar h2 { text-align: right; margin: 0; }
div.sidebar ul { padding-left: 1.5em; font-size: x-small; margin-left: 0; text-align: left; }
div.sidebar img { display: block; margin: auto; }

ul { padding: 0 0 0 3em; }
ul.links { list-style-type: none; }

div.border {
    border: #eee solid thick;
    border-right: none;
}

#footer {
    background: #444;
    color: #aaa;
    font-size: x-small;
    text-align: right;
}

#bottommenu {
    background: #444;
    font-size: x-small;
    text-align: center;
    color: #aaa
}
#bottommenu a { color: #aaa }

table.moduletable th {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: bold;
   color: #111D32;
   text-align: left;
   width: 100%;
   background: transparent url(../images/arrow.gif) no-repeat left;
   text-indent: 18px;
   height: 20px;
   line-height: 20px;
   border-bottom: 1px solid #FF3300 repeat;
   }

/* Main Menu(s) */

a.mainlevel {
font-size: 10px;
padding-left: 14px;
width: 143px;
line-height: 15px;
margin-bottom: 2px;
text-decoration: none;
font-weight: normal;
background: transparent url(../images/menustrelica.gif) no-repeat left;
}

a.mainlevel:hover, a.mainlevel#active_menu {
background: transparent url(../images/menustrelica1.gif) no-repeat left;
text-decoration: none;
}

.poll {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #990000;
   line-height: 14px
   }

.createdate {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #999999;
   text-decoration: none;
   font-weight: normal;
   height: 25px;
   }

.modifydate {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #9E9E9E;
   text-decoration: none;
   font-weight: normal;
   padding-top: 10px;
   text-align: right;
   }

.sectiontableheader {
   background-color : #990000;
   background-repeat: repeat;
   padding: 2px;
   color : #FFFFFF;
   font-weight : bold;
   padding: 2px;
   }

.sectiontableentry1, {
   background-color : #E2E2E2;
   }
   
.sectiontableentry2 {
   background-color : #F3F3F3;
   }

.readon{
   display:block;
   width: 100px;
   padding-left: 12px;
   background: url(../images/kom.gif) no-repeat left;
  padding-top: 5px;
  font-size: 11px;
  }
 
  .contentheading{
   font: bold 15px "Georgia",serif;
   color: #333;
   text-decoration: none;
  padding: 0px 0 0 0px;
}

.componentheading{
   font: bold 15px "Georgia",serif;
   color: #333;
   text-decoration: none;
  padding: 0px 0 0 0px;
}


Firefox visualizza tutto una bellezza. Tra l'altro ho problemi con la stampa se fatta tramite comando stampa del browser, stampa tutto nero.

Grazie

[giak]

purtroppo ie e i css sono un po' come il diavolo e l'acqua santa e a sentire in giro con ie7 sara' pure peggio, staremo a vedere! comunque: prendi il file inde.php del tuo template e cerca questa stringa, se non e' uguale dovrebbe essere simile:
<!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">

qui sostituisci il termine Transitional con Strict se non va elimina direttamente Transitional e non mettere nulla. Se non funziona cosi vediamo di mettere mano al css. Altra cosa: quando metti i numeri specifica sempre se sono percentuale (%) o pixel (px), ie guarda anche questo. Prima prova a specificare il tipo di unita' di misura e poi tenta la strada citata all'inizio del post. Fa sapere che succede

[SalSal]

Niente di nuovo sotto il cielo. IE fa le bizze. Firefox va un gioiello. Ma perchè non usano tutti firefox? E qui tanti discorsi......

Ti riporto il file index, che, a dire la verità, ho modificato con le tabelle.

Grazie per l'aiuto.


 <!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">
    <head>
        <title><?php echo $mosConfig_sitename; ?></title>
         <link href="<?php echo $mosConfig_live_site;?>/templates/novagodina_modif/css/template_css.css" rel="stylesheet" type="text/css" />
         <style type="text/css">
<!--
.Stile1 {
   font-size: 10px;
   color: #FFFF00;
}
-->
         </style>
    </head>
    <body>
    <div id="master">
      <div id="header1">
        <table width="719" height="60" border="0">
  <tr>
    <td width="300" height="60"><img src="<?php echo $GLOBALS['mosConfig_live_site']?>/templates/novagodina_modif/images/logo1.gif" width="300" height="45" border="0" align="bottom" /></td>
    <td width="30%"><div align="right">
      <?php mosLoadModules ( "user3" ); ?>
</div></td>
  </tr>
</table>
      </div>
      
      <div id="header">
            <table width="710" border="0" cellspacing="1">
  <tr>
    <td width="459" height="201" rowspan="2"><a href="index.php?option=com_content&amp;task=category&amp;sectionid=4&amp;id=17&amp;Itemid=29"><img src="<?php echo $GLOBALS['mosConfig_live_site']?>/templates/novagodina_modif/images/img1.gif" width="459" height="200" border="0" />[/url]</td>
    <td width="261" height="100">                                <a href="index.php?option=com_content&amp;task=category&amp;sectionid=4&amp;id=13&amp;Itemid=27"><img src="<?php echo $GLOBALS['mosConfig_live_site']?>/templates/novagodina_modif/images/img2.gif" width="255" height="98" border="0" />[/url]</td>
  </tr>
  <tr>
    <td width="261" height="100"> <a href="index.php?option=com_content&amp;task=category&amp;sectionid=4&amp;id=18&amp;Itemid=28"><img src="<?php echo $GLOBALS['mosConfig_live_site']?>/templates/novagodina_modif/images/img3.gif" width="255" height="98" border="0" />[/url]</td>
  </tr>
</table>

         
        </div>
      <table width="720" height="4" border="0" bordercolor="959595" bgcolor="959595">
  <tr bgcolor="959595">
    <td width="70%" bgcolor="959595"><?php mosLoadModules ( "user4" ); ?>
      </td>
    <td width="30%">&nbsp;</td>
  </tr>
</table>

       <ul id="menu2">
         <?php mosLoadModules ( "user5" ); ?>
       </ul>
         <div id="content">
           <div class="sidebar">             
                <ul class="links">
                 <?php mosLoadModules ( "left" ); ?>   
                </ul>
               
           </div>
           
           
            <div class="item">
              Percorso: <?php mosPathWay(); ?>
           
              <?php include_once("mainbody.php"); ?>
             
            </div>
            <div class="item">
               <?php mosLoadModules ( "top" ); ?> 
               <p>&nbsp;</p>
            </div>
        </div>
         <div id="footer"></div>
    </div>
    </body>
</html>