Bon matin tout le monde!
Autour d'un bon chocolat chaud avec un croissant tout juste sorti du four, je me décide a vous faire part d'un problème qui revient souvent quand je découpe un design et que je le transpose en xhtml/css.
Arrêtons de parler dans le beurre, et montrons la sauce:
Création d'une boite avec coins arrondi et bordure de 1px, largeur fixe. Je dispose donc de 2 images (top et bas ) + un conteneur extensible verticalement.
Code:
Mon CSS:
L'URL : http://lacamrappa.com/bordureblem.html (Mais dis donc, je vous gate! Vous avez intérêt à trouver l'erreur!)
Vous remarquez que la bordure dépasse sur mes images...ce qui est ,ma foie, non désiré comme rendu (même si certains diront que c'est de l'art abstrait)!
Tout en sirotant le dis chocolat chaud, j'attends une solution...il me reste du pain sur la planche!
Merci,
PS J'ai failli oublier, y a t il nécessité d'inclure des commentaire conditionnels dans ce cas?
Cette formule chimique me fait peur étant donné que ma largeur est fixe:
Sous FF : largeur réelle = width + padding + border
Sous IE : largeur réelle = width
Modifié par Samuel (24 Mar 2008 - 09:18)
Autour d'un bon chocolat chaud avec un croissant tout juste sorti du four, je me décide a vous faire part d'un problème qui revient souvent quand je découpe un design et que je le transpose en xhtml/css.
Arrêtons de parler dans le beurre, et montrons la sauce:
Création d'une boite avec coins arrondi et bordure de 1px, largeur fixe. Je dispose donc de 2 images (top et bas ) + un conteneur extensible verticalement.
Code:
<div id="boite_cont">
<div id="boite_cont_haut"></div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec quis elit. Pellentesque eleifend tellus ac neque sollicitudin pellentesque. Nam semper nulla a mi. </p>
<div id="boite_cont_bas"></div>
</div>
Mon CSS:
#boite_cont {
width: 470px;
border-left: 1px solid #7aB620;
border-right: 1px solid #7aB620;
margin:20px 0px 0px 0px;
}
#boite_cont_haut {
background-image: url(boite_cont_haut.jpg);
height:8px;
width:470px;
background-repeat: no-repeat;
margin:0px;
}
#boite_cont_bas {
background-image: url(boite_cont_bas.jpg);
height:8px;
width:470px;
background-repeat: no-repeat;
margin:0px;
}
L'URL : http://lacamrappa.com/bordureblem.html (Mais dis donc, je vous gate! Vous avez intérêt à trouver l'erreur!)
Vous remarquez que la bordure dépasse sur mes images...ce qui est ,ma foie, non désiré comme rendu (même si certains diront que c'est de l'art abstrait)!
Tout en sirotant le dis chocolat chaud, j'attends une solution...il me reste du pain sur la planche!
Merci,
PS J'ai failli oublier, y a t il nécessité d'inclure des commentaire conditionnels dans ce cas?
Cette formule chimique me fait peur étant donné que ma largeur est fixe:
Sous FF : largeur réelle = width + padding + border
Sous IE : largeur réelle = width
Modifié par Samuel (24 Mar 2008 - 09:18)