Code Bloc à bords arrondis

benji^^ Messages postés 100 Statut Membre -  
 gronobo -
Bonjour,

Je voudrais savoir comment mettre en place le code pour bloc à angles arrondis qui est sur cette page : http://www.webdemark.fr/webdesign/css/angles-arrondis-en-css/

Avec la méthode "Avec la propriété CSS border-radius".

Merci !
Configuration: Windows Vista
Firefox 3.0

11 réponses

  3.
    benji^^ Messages postés 100 Statut Membre 10
     
    Non me donner le code entier parce que je ne sais pas comment l'assembler.
    Merci
    0
  4. benji^^ Messages postés 100 Statut Membre 10
     
    Merci c'est super ton site !
    Merci a vous deux !
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. benji^^ Messages postés 100 Statut Membre 10
     
    Désolé je ne sais toujours pas comment placer le code css dans le site que tu m'as proposé ...
    0
  7. RAD ZONE Messages postés 5362 Statut Contributeur 1 360
     
    Pour le code donne sur le site
    si tu veux le faire avec le css embarque cela doit donner ca par exemple 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>RAD ZONE Webcreation</title>
  <meta name="author" content="http://radservebeer.free.fr" />
  <meta name="generator" content="PSPad editor, www.pspad.com" />
  <style type="text/css">
  .roundedcornr_box_312833 {
	background: url(roundedcornr_312833_tl.png) no-repeat top left;
}
.roundedcornr_top_312833 {
	background: url(roundedcornr_312833_tr.png) no-repeat top right;
}
.roundedcornr_bottom_312833 {
	background: url(roundedcornr_312833_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_312833 div {
	background: url(roundedcornr_312833_br.png) no-repeat bottom right;
}
.roundedcornr_content_312833 {
	background: url(roundedcornr_312833_r.png) top right repeat-y;
}

.roundedcornr_top_312833 div,.roundedcornr_top_312833,
.roundedcornr_bottom_312833 div, .roundedcornr_bottom_312833 {
	width: 100%;
	height: 66px;
	font-size: 1px;
}
.roundedcornr_content_312833, .roundedcornr_bottom_312833 {
	margin-top: -19px;
}
.roundedcornr_content_312833 { padding: 0 66px; }
  </style>
</head>
  <body>
   <div class="roundedcornr_box_312833">
   <div class="roundedcornr_top_312833"><div></div></div>
      <div class="roundedcornr_content_312833">
         <p>Lorem ipsum dolor sit amet, consectetur 
         adipisicing elit, sed do eiusmod tempor incididunt 
         ut labore et dolore magna aliqua. Ut enim ad minim 
         veniam, quis nostrud exercitation ullamco laboris 
         nisi ut aliquip ex ea commodo consequat. Duis aute 
         irure dolor in reprehenderit in voluptate velit esse 
         cillum dolore eu fugiat nulla pariatur. Excepteur 
         sint occaecat cupidatat non proident, sunt in culpa 
         qui officia deserunt mollit anim id est laborum.</p>
      </div>
   <div class="roundedcornr_bottom_312833"><div></div></div>
</div>
 </body>
</html>


    tu telecharge les images et c est bon

    RAD
    0
  8. benji^^ Messages postés 100 Statut Membre 10
     
    Merci, j'ai aussi vu sur le site du zero comment faire avec une page css externe mais j'ai un petit problème concernant le 3eme model avec des bordures où le bloc est a moitié coupé a la fin (essaie et tu verras).
    0
  9. RAD ZONE Messages postés 5362 Statut Contributeur 1 360
     
    la taille ne dois pas depasser 1024 px !!!!!!

    l image roundedcornr_288242_bl.png ne fais que 1024 px
    0
  10. benji^^ Messages postés 100 Statut Membre 10
     
    J'ai essayer une nouvelle méthode qui marche et qui est plus modifiable mais un peut moins design: http://www.webdemark.fr/webdesign/css/angles-arrondis-en-css/
    C'est la 4eme methode et je voudrais savoir comment peut on déplacer les blocks car je réussi en changeant la ligne : .examplesGoHere {text-align:center; margin: 3px; } (j'ai changé les 3px) mais lorsque l'on change ça, le bloc se déplace en diagonal et pas horizontalement de gauche à droite.

    Merci de votre précieuse aide.
    0
  11. benji^^ Messages postés 100 Statut Membre 10
     
    Nouveau problème et ne vous attardez pas sur le précédent ^^
    J'ai utiliser la méthode radius et je voudrais savoir si il était possible de déplacer le bloc.

    Voila !
    Merci !
    0
  12. ThEBiShOp Messages postés 9307 Date d'inscription   Statut Contributeur Dernière intervention   1 606
     
    tu veux qu'on te répète ce qu'il y a de marqué dans ce tuto ?
    -1

Discussions similaires

Liste de codes à 6 chiffres allant de 0 à 9.
Alex -
Medorinkashishikato -

7 réponses
C'est quoi un BILLING ZIP CODE
bikanane -
fabul -

1 réponse