27771 sujets

CSS et mise en forme, CSS3

Bonjour

Dès que je met un border d'1px j'ai un décalage d'1px qui s'ajoute entre la bordure du haut et de gauche avec mon contenu.
J'ai jamais eu ce problème auparavant donc je ne vois pas ce qui pourrait interférer.
Les padding et margin sont à 0.
Si je met border à 0 j'ai bien le contenu qui est bien calé.

upload/1652430352-84547-borderprobleme.png
sur l'image :
<div border 1px> <button red /> </div>
<ul border-left 1px> <li border-top 1px> <div red /> </li> </ul>
Il faut plus de code mais je dirais que comme border-top et border-left ne sont pas sur le même élément, ils s'écartent l'un de l'autre...
Modérateur
Salut !

Il faudrait nous en donner un peu plus coté code (et éventuellement en html valide Smiley lol ) qu'on puisse tester. Tu peux le reproduire dans un jsfiddle ?

J'ai tenté : https://jsfiddle.net/6nc7dhLy/

mais je ne reproduit que le petit espacement du haut sur le button. C'est parceque ton button est un élément inline-block et ca chie avec le line-height pour faire court. Tu peux corriger ca en lui donnant un display:block par exemple.

Pour le reste je n'arrive pas a reproduire.
Je le reproduis aussi sur fiddle. étrange.
J'en ai fait beaucoup d'intégrations html/css et c'est le premier projet où je vois ça. Je ne peux envoyer d'url car c'est un intranet ultra sécurisé.
Espérons que ce soit juste mon navigateur Smiley ohwell

https://jsfiddle.net/cj01eam4/5/

upload/1652440137-84547-borderprobleme2.png
Ah ben ça alors!!! j'ai ouvert le fiddle depuis mon autre ordi, pas d'espace... Pourtant 2 chromes mis à jour des 2 cotés.
Pas étonnant que ce soit le premier projet avec ce problème, c'est l'ordi de la boite dudit projet.
Je vous embête pas plus. Merci.
C'est re-moi, j'ai trouvé le coupable, je le met ici si jamais ça peut aider quelqu'un d'autre. upload/1652440720-84547-borderprobleme3.png
Meilleure solution