28111 sujets

CSS et mise en forme, CSS3

Je cherche à mettre une propriété last-child pour enlever un margin sur le dernier élement, mais impossible. Le pire c'est que cela à marché à un moment donné, mais que ca ne marche plus maintenant. Impossible de savoir pourquoi.
Merci pour votre aide.

Voici le html où il y a une boucle qui affiche 3 bloc "view" et le css.
<div class="view view-third">
                              
                              <img src="<?php $thumb_id = get_post_thumbnail_id(); $thumb_url = wp_get_attachment_image_src($thumb_id, array(400,300), true); if(has_post_thumbnail()){echo $thumb_url[0];; } ?>" />
                              <div class="mask"> 
                              <h2><?php the_title(); ?></h2>  
                              <p><?php $desc = get_post_meta($post->ID, '_description', true); if ($desc == true): ?><?php echo $desc ?><?php endif; ?></p>  
                              <a class="btn rouge center" href="<?php echo get_post_meta($post->ID, '_urlhome', true) ?>" class="info"><?php echo get_post_meta($post->ID, '_btn', true) ?></a>  
                              </div><!-- end mask -->
     </div> <!-- end view -->

.view {
    width: 290px;
    height: 200px;
    margin:10px 17px 10px 0px;
    float: left;
    border: 6px solid #fff;
    overflow: hidden;
    position: relative;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
    cursor: default;
   
}
.view:last-child {margin:10px 0px 10px 10px!important;}

Modifié par dreadstock (21 Apr 2015 - 12:12)
Administrateur
Bonjour,

le code PHP n'est pas intéressant quand il s'agit d'un problème HTML : est-ce que tu pourrais poster, idéalement dans un Codepen quitte à utiliser http://placekitten.com pour les images, le code HTML généré ?

Que dit un inspecteur HTML (Firebug, F12, DevTools, etc) dans la partie "Calculée" i.e. d'où / de quel sélecteur vient la marge finalement appliquée ?
Bonjour Felipe,
Du coup, j'ai choisi une autre option. J'ai créé une propriété .view + .view + .view {nouveau margin} et cela fonctionne.
C'est une alternative non ?
Merci
dreadstock a écrit :
Bonjour Felipe,
Du coup, j'ai choisi une autre option. J'ai créé une propriété .view + .view + .view {nouveau margin} et cela fonctionne.
C'est une alternative non ?
Merci


Oui mais c'est moins souple, si tu modifie le nombre de blocs "view" tu vas devoir retoucher ta règle CSS.