Posez votre question Signaler

CSS Faire un Border invisible ET solide ? [Résolu]

Philippe P. - Dernière réponse le 2 mars 2011 à 12:13
Bonjour,
je cherche à pallier l'un des gros défauts de IE, son impossibilité à gérer les instruction CSS "padding".
J'ai trouvé la solution en utilisant l'instruction "border: 20 px hidden;"
J'ai utilisé l'attribut hidden car j'ai une image en background, et la bordure ne doit pas la recouvrir.
Toutefois, il me semble que l'attribut "hidden" me supprime complètement la bordure.
Y a-t-il un moyen de régler ce problème, tout en gardant une bordure transparente ?
Merci d'avance
Lire la suite 

CSS Faire un Border invisible ET solide »

7 réponses
Réponse
+0
moins plus
Bjr

Certe IE n'est pas la Rolls mais il gère quand même le padding et le border en CSS

Tu dois te tromper quelque part

Que veux-tu faire exactement ? Poste ton code pour qu'on se rende compte

A la place de la bordure utilise plutôt les marges qui elles sont toujours transparentes
Philippe P. - 31 mai 2008 à 20:16
Je me suis mal formulé... Le padding fonctionne sous IE, mais pas de la même manière que Firefox. Alors les deux affichages sont différents et le résultat sur IE plutôt gênant.
Mais j'ai réussi à trouver la solution.

Dans le css, j'ai utilisé deux instructions :

border-right: 50px solid;
border-color: transparent;

Ce qui me donne l'équivalent du padding-right et qui fonctionne parfaitement sous les deux navigateurs.
C'est en quelque sorte du bricolage, mais j'ai vérifié et il passe au validateur.

merci quand même de m'avoir aidé, PhP !
Ajouter un commentaire
Réponse
+0
moins plus
J'aimerais bien voir un ex de la façon différente de fonctionner du padding ... quand même T'Oh !


Sur IE tu utilises bien un DOCTYPE dans l'entête de ta page HTML pour forcer IE à commuter en mode standard ?
Philippe P. - 1 juin 2008 à 12:08
J'utilise le code suivant au début de la page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

j'ai remarqué qu'il y avait un peu de différence avant et après l'ajout de cette ligne, mais pas au niveau du padding.

Et donc pour la manière de remplacer le padding,
padding-right: 50px;
est devenu
border-right: 50px solid transparent;

Ca donne la même chose à la fois sur Firefox et IE, alors que le padding donne des résultats différents.

Si tu veux voir par toi-même, voici l'adresse ou j'ai mis en application :
http://www.jfkfilm.fr/testautres
Attention, c'est une adresse que j'utilise pour les tests et le site n'est pas encore dynamique ; je n'en suis qu'à la forme... Une fois que le site sera terminé, l'adresse ne sera plus valide ;)
Ajouter un commentaire
Réponse
+0
moins plus
bsr

Sur IE 6 ta page de test est horrible : de gros rectangles verts apparaissent à droite et la TV totalement décalé vers le bas (en plus IE 6 ne gère pas la couche Alpha dans les png)

Je sais pas si c'est en rapport avec le padding mais c'est pour le moins bizarre ...
Ajouter un commentaire
Réponse
+0
moins plus
Tu peux utiliser "transparent" comme couleur pour faire une bordure invisible. bordure css
Ajouter un commentaire
Réponse
+0
moins plus
Salut,

Ca fonctionne impec avec ie6, ie7 mais c'est terminé pour ie8 et firefox
Ajouter un commentaire
Ce document intitulé « CSS Faire un Border invisible ET solide ? » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?