Compatibilité CSS avec les navigateurs
Bonjour,
Sur mon site (blog Wordpress), je souhaite afficher les articles sur le même sujet avec une miniature. J'ai trouvé une requête que j'ai adaptée et qui fonctionne bien.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
| <!-- sur le même sujet V2 -->
<h3>A LIRE SUR LE MEME SUJET :</h3>
<?php
$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=>6, // Number of related posts to display.
'caller_get_posts'=>1
);
$my_query = new wp_query( $args );
while( $my_query->have_posts() ) {
$my_query->the_post();
?>
<div class="miniatureliee">
<a rel="external" href="<? the_permalink()?>"><?php the_post_thumbnail(array(150,150)); ?><br/>
<?php the_title(); ?></a>
</div>
<? }
}
$post = $orig_post;
wp_reset_query();
?>
<!-- sur le même sujet V2 --> |
Par contre, le résultat est minable, les images (et le titre) sont mises l'une en dessous de l'autre. Pas "sexy" du tout.
J'ai donc fait du CSS pour améliorer tout ça :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| .miniatureliee {
margin: 5px;
width: 292px;
height: 150px;
float: left;
vertical-align:middle;
}
.miniatureliee a {
display : block;
margin: 10px 0 0 5px;
width: 292px;
height: 150px;
background-color: #ddd;
color: #000;
}
.miniatureliee img {
display : inline;
margin: 0 10px 0 0;
padding: 0px;
float: left;
}
.miniatureliee a:hover {
display : block;
width: 292px;
height: 150px;
font-weight:bold;
font-size: medium;
background-color: #2479b0;
color: #FEFEFE;
} |
Ça fonctionne très bien sous IE (8 et 9), mais sous firefox, cela ne fonctionne que pour la première rangée de liens. Et sous chrome, rien ne fonctionne (pas de lien clikable, ni d'effet "hoover").
Y a-t-il moyen de corriger cela ?
Le résultat n'est pas visible, car c'est sur mon site de test où les accès sont filtrés (mais je peux éventuellement ouvrir un accès temporaire).
Merci !
