28220 sujets

CSS et mise en forme, CSS3

Bonjour,

J’essaie en vain de définir une boîte de 1px de haut pour positionner précisément un trait horizontal. Pas de problème avec Netscape, mais Explorer affiche une boîte d’une dizaine de pixels et le trait (l’image) s’affiche en bas de la boîte. J’ai mis : * {margin:0; padding:0;}. Rien n’y fait. Voici mon code :
CSS :
* {margin:0; padding:0;}
.trait {
position : absolute; left : 150px; top: 218px; width :616 px; height : 1 px;}
.trait1 {
width :616 px; height : 1 px; border: 0;}
HTML :
<div class="trait">
<img src="images/trait_bleu.jpg" class="trait1" alt="trait">
</div>
Voilà le résultat.

Merci de votre aide... upload/3093-boiteie.jpg
Oui, hr est une solution ok avec explorer, mais je tombe sur un problème de débordement avec Netscape (?). De plus je veux définir un trait spécifique avec plusieurs couleur; donc une image.
Bonjour,

L'effet souhaité peut-être obtenu en utilisant tout simplement les bordures.

Un lien sur la page pourrait permettre d'aider un peu plus.

A propos de la rédaction des messages :

Le bouton "code" permet de baliser les codes proposés pour une meilleure lisibilité. Voir Aide/Règles
Smiley smile
Modifié par Vero (29 Aug 2005 - 12:09)
pourquoi une image ? en fonction de quoi change tu la couleur ?

Sinon dispose tu d'un serveur d'application (ASP, PHP ?)

Si oui, intégre ce style dans la page et fait une petite routine qui change la couleur en fonction de ton paramètre....
Modérateur
bonjour,
le truc pour obliger IE a afficher juste 1 pixel de haut pour certaine balise comme les div , c'est:
overflow:hidden;

et cela n'a pas d'incidence dans les autres navigateurs a priori..
<hr /> est bien, mais sous IE une marge avant et apres cette balise semble incompresible ... alors si quelqu'un connait le trucs pour appliquer un vrai margin:0 0; a <hr /> sous IE , je suis curieux., sinon hr accepte bien les tailles, bordures et images ou couleurs de fond.
a plus
super! merci pour overflow:hidden; ça marche.
Sinon, j'avais bidouillé un truc, je suis arrivé à un résultat à peu près. Il semble que netscape pour hr, background et border n’affiche qu’autant que la boîte est remplie ! J’ai donc créé une image gif blanche (mon fond est blanc)de 1px (il semble que le background et hr s’épaulent pour s’afficher ! ?). Ci-après le code que je ne trouve pas très orthodoxe mais si quelqu’un peut m’expliquer tout ça je suis preneur… Merci à tous
.trait {position : absolute; left : 150px; top: 218px; width :616 px; background-image: url('images/trait.gif'); background-repeat: repeat x; border-top: 1px solid blue;}
hr.trait1 { width :616 px; height : 1 px; color: white; border: 0; }


<div class="trait" ><hr class="trait1" /></div>
Salut,

a écrit :
le truc pour obliger IE a afficher juste 1 pixel de haut pour certaine balise comme les div , c'est:
overflow:hidden;


hé, hé ça fait une heure que je rame la dessus en me traitant de débutant ignare, bien sûr fallait juste le savoir, encore une bizarrerie de IE je présume, tu me sauve Gcyrillus merci Smiley prie
Modifié par zanzibar (29 Aug 2005 - 16:23)