Carissimi,
sto studiando i template di joomla, ne sto creando uno utilizzando div e relativi css.
Questo è il risultato attuale:
www tourz it/joomla
vorrei centrare il tutto, ma essendo poverissimo in div e css, non riesco.
Pensavo di provare a lavorare sul DIV esterno "gabbia" ma non riesco.
Provo a postare il codice del file index.php e il relativo layout.css
Index.php:
...
...
<link rel="stylesheet" href="templates/apollo/css/layout.css" type="text/css" />
</head>
<body>
<!-- Gabbia esterna -->
<div id="gabbia">
<!-- Testata: deve ontenere solo il ritaglio dell'immagine quindi si apre e si chiude e nel file layout.css ci sarà il puntamento al file grafico -->
<div id="top"> </div>
<!-- Apre il corpo centrale -->
<div id="centro">
<!-- lasciamo aperto perchè conterrà tutto il corpo del sito -->
<!-- immagine proncipale -->
<div class="header"></div>
<!-- la barra di navigazione -->
<div class="navigatore">
<jdoc:include type="module" name="breadcrumbs" />
</div>
<!-- Menù laterale -->
<div class="bloccoleft"><jdoc:include type="modules" name="left" style="" />
</div>
<!-- blocco centrale dei componenti -->
<div class="middle"><jdoc:include type="component" /></div>
<!-- Clear Setta impostazioni ottimali -->
<div class="clear"></div>
<!-- copyright -->
<div class="piedipagina"><jdoc:include type="module" name="footer" />
</div>
</div>
<div id="down"> </div>
</body>
</html>
LAYOUT.php
- {
padding: 0;
margin: 0;
}
#gabbia {
margin-top: 20px;
margin-left: 20px;
width: 725px;
background: #fff url('../images/middle.jpg');
background-repeat: repeat-y
}
#top {
background: url('../images/top.jpg');
height: 28px;
}
#centro {
padding: 0 40px 0 40px;
}
.header {
height: 190px;
background: #6897EF url('../images/city2.jpg');
}
.navigatore {
background: #F6F9FB;
border-bottom: lpx solid #DEDCDC;
padding-top: 5 px;
padding-bottom: 5px;
padding-left: 5px;
width: 645px;
}
.bloccoleft {
float: left;
width: 180px;
height: 100%;
margin-right: 0;
margin-top: 5;
background:;
}
.middle{
width: 450 px;
margin: 5 0px;
margin-left: 180 px;
padding-left: 10px;
}
#clear {
display: block;
clear: both;
width: 100%;
height: 1px;
overflow: hidden;
}
#down {
background: url('../images/down.jpg');
height: 24px;
}
.piedipagina {
background:;
text-align: center;
border-bottom: lpx soldi;
padding: 5px;
}
So che qui troverò le dritte per risolvere il mio piccolo problema.
GRAZIE A TUTTI