| Re: probleme bloc de droite avec tableau |
Titre du sujet : Re: probleme bloc de droite avec tableau
par Christian sur 22/06/2006 16:08:02
C'est pas si grave que cela, c'est que la balise img est définie deux fois une fois dans le fichier xoops.css et une seconde dans la partie style que je t'ai ajouter.
Il suffit de modifier ainsi pour que cela fonctionne :
<?php
include("../mainfile.php");
include(XOOPS_ROOT_PATH."/header.php");
$xoopsOption['show_rblock'] = 1; // 1 = Avec blocs de droite - 0 = Sans blocs de droite
?>
<style type="text/css" />
h2 {text-align: center;}
#wrap{
width:720px;
margin:0 auto;
position:relative;
}
#main-content li{
width:303px;
border:solid #CCC;
border-width:0 1px 1px 0;
/* uncomment and adjust this if you want a rounded frame in Mozilla browsers
-moz-border-radius:20px;
*/
background:#FFF;
padding:10px;
text-align:center;
position:relative;
float:left;
display:inline;
margin:5px;
}
.img2{
border:1px solid #EEE;
/* delete line above and uncomment this for an inset effect
border:1px solid;
border-color:#666 #EEE #EEE #666;
*/
}
</style>
<div id="wrap">
<h2>Vriska a 4 mois</h2>
<div id="main-content">
<ul>
<li><img src='http://bonny.jexiste.fr/mespages/4mois8.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois7.jpg' width='300' height='225' style='border-width: 0px;' class='img2'/></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois6.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois5.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois4.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois3.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois2.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
<li><img src='http://bonny.jexiste.fr/mespages/4mois1.jpg' width='300' height='225' style='border-width: 0px;' class='img2' /></li>
</ul>
</div>
</div>
<?php
include(XOOPS_ROOT_PATH."/footer.php");
?>
la classe img est renommée en img2 et on ajoute le style dans la balise img
Si la présentation en tableau parait facile avec un éditeur wisiwyg(dreamweaver, frontpage,etc..) ce n'est pas la meilleure sémantique. L'utilisation d'une feuille de style stockée dans le cache du navigateur client permet une séparation des données et de la présentation, une affichage plus rapide, et une meilleure accessibilité.
|
|
