Articles of css

Comment recadrer et centrer automatiquement une image

Étant donné une image arbitraire, je veux rogner un carré du centre de l’image et l’afficher dans un carré donné. Cette question est similaire à celle-ci: CSS Affiche une image redimensionnée et recadrée , mais je ne connais pas la taille de l’image, donc je ne peux pas utiliser les marges définies.

différence entre css height: 100% vs height: auto

On m’a posé une question dans une interview: “Quelle est la différence entre la height:100% CSS height:100% et la height:auto ?” Quelqu’un peut-il expliquer?

Paramètres optimaux pour l’exportation de fichiers SVG pour le Web à partir d’Illustrator?

Je cherche à utiliser un logo SVG pour un site Web – pour le rendre parfait sur un design réactif pour tous les appareils. Mais comme il y a des problèmes , je veux prendre en charge autant d’appareils et de navigateurs que possible. La vitesse de chargement est également une considération importante. Comment les […]

comment désélectionner max-height?

Comment réinitialiser la propriété max-height à sa valeur par défaut, si elle a déjà été définie dans une règle CSS? parce que cela ne fonctionne pas: pre { max-height: 250px; } pre.doNotLimitHeight { max-height: auto; //Doesn’t work at least in chrome }

Positionnement absolu ignorant le remplissage de parent

Comment créer un élément positionné absolu pour honorer le remplissage de son parent? Je veux qu’un div interne s’étende sur la largeur de son parent et soit placé au bas de ce parent, essentiellement un pied de page. Mais l’enfant doit respecter le remplissage du parent et ce n’est pas ce que fait. L’enfant est […]

Effet de transition CSS rend l’image floue / déplace l’image 1px, dans Chrome?

Lorsque le div est survolé, un effet de transition CSS déplace le div. Le problème, comme vous pouvez le voir dans l’exemple, est que la transition «translate» a l’effet secondaire horrible de faire bouger l’image dans le div de 1px vers le bas / vers la droite (et éventuellement de la redimensionner légèrement?) Pour qu’elle […]

Qu’est-ce qu’un «contenu au-dessus du pli» dans Google Pagespeed?

Jusqu’à récemment, mon site (www.heatexchangers.ca) avait obtenu 98% sur Google Page Speed. Il y avait quelques choses auxquelles je ne pouvais rien faire, comme la chaîne de requête des fonts Web. J’étais très content de cela car cela représentait tout ce que je pouvais faire. Récemment, Google a ajouté quelque chose qui affecte le score […]

Comment append une marge à une ligne de tableau

J’ai une table contenant plusieurs lignes. Certaines de ces lignes sont class=”highlight” et signifient une ligne qui doit être stylée différemment et mise en évidence. Ce que j’essaie de faire est d’append un espacement supplémentaire avant et après ces lignes afin qu’elles apparaissent légèrement séparées des autres lignes. Je pensais pouvoir faire cela avec margin-top:10px;margin-bottom:10px; […]

display: marge supplémentaire du bloc en ligne

Je travaille avec quelques div qui sont définies pour display: inline-block et ont une height et une width définies. Dans le HTML, s’il y a un saut de ligne après chaque div il y a une marge automatique de 5px à append à droite et au bas du div. Exemple: Some Text Some Text Y […]

Comment le caractère «supérieur à» ou «>» est-il utilisé dans CSS?

J’ai vu ce personnage un certain nombre de fois dans des fichiers CSS mais je n’ai aucune idée de la manière dont il est utilisé. Quelqu’un peut-il me l’expliquer et montrer comment ils sont utiles pour rendre un style de page plus facile?