Bonsoir,
Je me suis intéressé à Plume en début de mois et ai enfin abouti à quelque chose de correct (du moins c'est mon opinion, je suis ouvert à toute critique !)
Je passe à présent à la phase "affichage correct sur IE". Voici les quelques petites choses que je n'arrive pas à régler :
¤ la position absolute de mes boutons "lire" est bien prise en compte par IE mais d'une façon bizarre (en hauteur c'est bon mais en largeur ce n'est pas ça ). Voyez plutôt : http://127.0.0.1/site-jojaba/?/Programmes-traduits/
CSS
Conteneur :
Bouton
HTML
¤ Les boîtes de sommaire des articles ne s'affichent pas, j'ai l'impression qu'ils se retrouvent sous l'image de fond. Exemple : http://jojaba.free.fr/?/Programmes-traduits/jEdit
CSS
Conteneur :
Boîte sommaire :
HTML
Merci d'avance pour votre aide.
Modifié par jojaba (01 Sep 2006 - 19:34)
Je me suis intéressé à Plume en début de mois et ai enfin abouti à quelque chose de correct (du moins c'est mon opinion, je suis ouvert à toute critique !)
Je passe à présent à la phase "affichage correct sur IE". Voici les quelques petites choses que je n'arrive pas à régler :
¤ la position absolute de mes boutons "lire" est bien prise en compte par IE mais d'une façon bizarre (en hauteur c'est bon mais en largeur ce n'est pas ça ). Voyez plutôt : http://127.0.0.1/site-jojaba/?/Programmes-traduits/
CSS
Conteneur :
.resource{
position: relative;
margin: 0;
padding: 5px;
width: auto;
background: transparent url(img/fond-ressource.png) repeat-y;
border-bottom: dotted #ABABAB 3px;
border-right: solid #ABABAB 3px;
}
[code].lecture{
position: absolute;
top: 5px;
right: 5px;
margin: 0;
padding: 0;
}
Bouton
.lecture a{
border: 0;
}
.lecture a:hover{
border:0;
}
HTML
<div class="resource">
<h2 class="resource-title">
<?php pxResTitle('%s'); ?>
</h2>
<p class="resource-info">Le <?php pxResDateModification('%d/%m/%y à %HH%M'); ?>
, par <a href="mailto:<?php pxResAuthorEmail( '%s', 'link'); ?>"><?php pxResAuthor(); ?></a> <?php pxResCategories('<br />dans %s'); ?>.</p>
<div class="resource-content">
<?php pxResDescription('%s', 500); ?>
</div>
<p class="lecture"><a href="<?php pxResPath(); ?>"><img alt="Lire..." src="<?php pxInfo('filesurl'); ?>theme/jojaba/img/lire.png" title="Lire..." /></a></p>
</div>
¤ Les boîtes de sommaire des articles ne s'affichent pas, j'ai l'impression qu'ils se retrouvent sous l'image de fond. Exemple : http://jojaba.free.fr/?/Programmes-traduits/jEdit
CSS
Conteneur :
#article, #news {
margin-bottom: 10px;
padding: 5px;
background: transparent url(img/fond-ressource.png) repeat-y;
border-bottom: solid #ABABAB 3px;
border-right: solid #ABABAB 3px;
color: #000;
font-size: 1em;
text-align: justify;
line-height:15px;
}
Boîte sommaire :
#art-sommaire{
float: right;
margin: 0;
padding: 40px 5px 10px 10px;
width: 180px;
}
#art-sommaire .boite{
background: #F4F4F4;
border-left: solid #8C8C8C 1px;
border-top: solid #8C8C8C 1px;
border-right: solid #8C8C8C 3px;
border-bottom: solid #8C8C8C 3px;
}
#art-sommaire h2{
margin: 5px;
padding: 5px;
background: transparent url(img/h2-sidebar.png) repeat-y;
color: #666;
border-right: solid #8C8C8C 3px;
border-bottom: solid #8C8C8C 3px;
text-align: center;
font-weight: bold;
text-transform: uppercase;
font-variant: normal;
font-size: 0.8em;
line-height: 20px;
}
#art-sommaire ol{
margin:0;
padding: 0;
background: transparent;
list-style-type: none;
text-align: center;
font-size: 0.7em;
}
#art-sommaire ol li {
margin: 2px 10px 2px 10px;
padding: 0;
background: #FFF;
line-height: 1.2em;
}
#art-sommaire ol li a{
margin: 0;
padding: 0;
display: block;
background: #FFF;
text-decoration: none;
color: #000;
border-bottom: 1px solid #8C8C8C;
border-right: 1px solid #8C8C8C;
}
#art-sommaire ol li a:hover{
margin: 0;
padding: 0;
background: #FFF;
border-bottom: 0;
border-right: 0;
border-top: 1px solid #8C8C8C;
border-left: 1px solid #8C8C8C;
color: #000;
}
#art-sommaire ol li.current a{
margin: 0;
padding: 0;
color: #000;
background: #FFF;
border-right: solid #8C8C8C 2px;
border-bottom: solid #8C8C8C 2px;
font-weight: bold;
text-decoration: none;
}
#art-sommaire ol li.current a:hover{
margin: 0;
padding: 0;
background: #FFF;
color: #000;
border-right: solid #8C8C8C 2px;
border-bottom: solid #8C8C8C 2px;
border-top: 0;
border-left: 0;
font-weight: bold;
text-decoration: none;
}
HTML
<div id="article">
<?php pxArtListPages('<div id="art-sommaire"><div class="boite"><h2>Sommaire</h2>%s</div></div>'); ?>
<h2 class="art-page-title">
<?php pxArtPageTitle(); ?>
</h2>
<?php pxArtPageContent(); ?>
</div>
Merci d'avance pour votre aide.
Modifié par jojaba (01 Sep 2006 - 19:34)