Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
654 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  balise "a" me déforme les images.

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

balise "a" me déforme les images.

n°2276798
gdhia
Posté le 02-03-2016 à 22:23:29  profilanswer
 

Bonjour à tous,
 
sur la page suivante: http://rac-spa.org/sites/default/f [...] ndex2.html
 
le css que j'utilise permet normalement de faire en sorte que les images se redimensionnement automatiquement selon la taille de l'ecran (pc, tablette, téléphone...) comporte une définition.
 
j'essaye de mettre des lien de sorte que lors du clic sur une couverture, ça ouvre une autre page, mais quand j'insère la balise <a href>, la définition existant dans le CSS pour cette balise déforme l'image.

Spoiler :

.showcase a:link, .showcase a:visited, .showcase a:hover, .showcase a:active {
    color: white !important;
    display: block;
    margin: 0 auto 1rem;
    position: relative;
    text-decoration: none;
    width: 11.75rem;}


j'ai donc du créer une nouvelle classe "a.one" avec le CSS suivant pour l'image reste dans la bonne proportion (vous verrez que la différence est au niveau du width:
 

Spoiler :

.showcase a.one:link, .showcase a.one:visited, .showcase a.one:hover, .showcase a.one:active {
    color: white !important;
    display: block;
    margin: 0 auto 1rem;
    position: relative;
    text-decoration: none;
    width: 16.29rem;}


le problème c'est que maintenant quand j'ouvre la page sur un téléphone, toutes les images qui n'ont pas de lien activé apparaissent redimensionnées, mais celles qui ont un lien gardent ce width redéfinit.
 
 
Est ce que quelqu'un pourrait m'aider à résoudre ce problème d'une façon pro ?
 
 
Merci d'avance.

mood
Publicité
Posté le 02-03-2016 à 22:23:29  profilanswer
 

n°2276832
mechkurt
Posté le 03-03-2016 à 10:46:19  profilanswer
 

Tu as des balises codes c/c++ qui conviennent mieux que des spoilers.
Tu peux simplifier ton sélecteur css en .showcase a { puisque tu liste toutes les pseudo class qui s’applique au a
 
Pour ton problème spécifique, est ce que tu as essayé de changer la width de ta balise img pour 100% (car la je vois juste max-width).


---------------
D3

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  balise "a" me déforme les images.

 

Sujets relatifs
[HTML/Bootstrap] Problème d'affichage d'images bootstrap[HTML5/PHP] Galerie d'images générée dynamiquement
affichage images aléatoirementInsérer des images avec légende dans word 2010
[Aide] convertir balise <iframe> en <object>Comment programmer un tirage d'images au hasard ?
Images webcamProbleme de validation CSS2.1) : balise <style> et autre
Arrière plan CSS en 3 images .soucis !Création d'une sous gallerie d'images
Plus de sujets relatifs à : balise "a" me déforme les images.


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR