Page 2 sur 2

bords arrondis

Publié : 10 mars 2008, 23:11
par malamok
bonsoir Mongo Bob
En css.
.hd {
float: right;
background-image: url(../images/coinhd.png);
background-repeat: no-repeat;
width: 32px;
height: 33px;
background-position: right top;
}
.hg {
background-image: url(../images/coinhg.png);
background-repeat: no-repeat;
width: 32px;
height: 33px;
}
.bd {
background-image: url(../images/coinbd.png);
background-repeat: no-repeat;
width: 32px;
height: 32px;
float: right;
background-position: right bottom;
}
.bg {
width: 32px;
height: 32px;
background-image: url(../images/coinbg.png);
background-repeat: no-repeat;
background-position: left bottom;

En html:
<div id="p1">
<div class="hd"></div>
<div class="hg"></div>
le
club - les vétérans -
<img style="width: 529px; height: 331px;" alt=""
src="../images/veterans.PNG"><br>
&nbsp;<br>
<br>
<div style="" class="bd"></div>
<div style="top: 794px; left: 318px;" class="bg"></div>
</div>
j'espère que c'est suffisant
Merci



Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.12) Gecko/20080201 Firefox/2.0.0.12

Publié : 11 mars 2008, 07:52
par chinon37
Mongo Bob a écrit :
chinon37 a écrit :Un excellent tuto sur les coins arrondis: http://www.alsacreations.com/articles/cadre/
je croyais qu'il avait été supprimé, il est même pas au sommaire, si je ne m'abuse....
Et oui, c'est à ça qu'on voit les pros :twisted: :lol: :mrgreen: Bien sûr, ce n'est pas permis au commun des mortels... :P

Publié : 11 mars 2008, 08:24
par Ymai
Cette partie du site -et d'autres- a été transférée dans le livre.
A conseiller, le livre... (pub gratuite)

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.12) Gecko/20080207 Ubuntu/7.10 (gutsy) Firefox/2.0.0.12

Publié : 11 mars 2008, 08:39
par chinon37
Oupsss, tu as raison, Ymai, j'aurais tout de même pu le préciser... :oops: :?
Mais un des moteurs de recherche les plus utilisés (voire le plus utilisé) donne toujours le lien de l'archive :wink:

à Malamok: je crains que ton problème soit lié au div bord gauche qui ajoute un positionnement en style interne à la classe .bg. Pourquoi ne pas mettre tout le style dans la classe ? Et pourquoi mettre un positionnement fixe qui empêche de suivre le flux des différents éléments concernés ?

bords arrondis

Publié : 11 mars 2008, 22:31
par malamok
bonsoir
chinon 37 a écrit:
à Malamok: je crains que ton problème soit lié au div bord gauche qui ajoute un positionnement en style interne à la classe .bg. Pourquoi ne pas mettre tout le style dans la classe ? Et pourquoi mettre un positionnement fixe qui empêche de suivre le flux des différents éléments concernés ?
j'ai supprimer le style interne à.bg et mis les 4 .class en position absolue et leur div conteneur en relative d'après le tuto d'alsacréations mais rien ne se passe lorsque j'allonge mon cadre <div id="p1">.
par la suite j'ai crée un div supplémentaire pour le texte et lorsque j'augmente sa hauteur les coins du bas suivent .Il faut alors que j'allonge le div cadre d'autant. j'espère que c'est correct :?:
merci de me donner ton avis :D

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.12) Gecko/20080201 Firefox/2.0.0.12

Publié : 13 mars 2008, 20:17
par krystof
Mongo Bob a écrit : En html pur, c'est impossible (certitude à 95,5%).
Bonjour,
il existe un code permettant de décaler les div au fur et à mesure, je n' arrive pas à mettre la main sur ce code.
En tout cas cette technique ne nécessite pas d' image.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Maxthon; .NET CLR 1.1.4322; .NET CLR 2.0.50727; IE7-01NET.COM-1.1; IE7-01NET.COM-1.1)