[CSS] Bordure ...

krabs Messages postés 54 Statut Membre -  
 Yessine -
Bonjour,
Je cherche depuis pas mal de temps a faire un div de hauteur et de largeur donné dont les angles sont arrondis et la bordure de type "inset" sans utiliser d'image.
Si quelqun aurait une idéé..
Merci
Configuration: Windows XP
Firefox 2.0.0.3

8 réponses

  1.
    Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    salut,

    à mon avis, les angles [...] arrondis et la bordure de type "inset" et sans utiliser d'image, ça fait un élément de trop.
    tu as bien le code pour la bordure en 'inset', il le fait tout seul, krabs t'as montré comment faire des arrondis mais je ne vois pas comment faire les deux à la fois d'autant plus que tu ne veux pas de bitmap...
    1
    1. s.spark Messages postés 2528 Statut Contributeur 618
       
      Je maintien mot pour mot tout ce que je viens de dire et je n'ai pas parlé d'images. Le bitmap n'est pas le seul format d'image, d'ailleurs il n'est jamais utilisé sur des pages web, par contre le jpg, le gif et le png, eux le sont largement.
      0
      1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923 > s.spark Messages postés 2528 Statut Contributeur
         
        salut,

        par bitmap je n'entendais pas le format bmp mais les images matricielles, quand à leur utilisation...
        donc je te répète que coins arrondis et bordure sans image, pour moi c'est impossible raisonnablement. il y en a simplement un de trop.
        0
  2. xjl Messages postés 232 Statut Membre 183
     
    Salut,

    tu devrais jeter un oeil à cette discussion:
    html css

    Bonne chance ! ;-)
    0
  3. s.spark Messages postés 2528 Statut Contributeur 618
     
    Salut,

    Cette fonction n'existe pas. Toutefois elle existe de façon propriétaire, ainsi sous mozilla ca donne : 
    -moz-border-radius: 10px 10px 10px 10px;


    Par exemple. Sous IE ca n'existe pas, piour khtml c'est avec un autre préfixe : 
    khtml-border-radius  10px 10px 10px 10px;


    Bref rien de bien génial, ces balises ne sont pas standardisé. Peut être qu'avec CSS3 on aura "border-radius".
    0
  4. krabs Messages postés 54 Statut Membre 20
     
    Merci beaucoup,
    Le probleme n'est pas les angles arrondis mais la bordure avec un effet d'ombre.
    J'utilise pour les coins arrondis l'html suivant: 
                 <b class="rtop">
                 <b class="r1"></b>
                 <b class="r2"></b>
                 <b class="r3"></b>
                 <b class="r4"></b>
             </b>

<div id="content"></div>

             <b class="rbottom">
                 <b class="r4"></b>
                 <b class="r3"></b>
                 <b class="r2"></b>
                 <b class="r1"></b>
             </b>

    avec ce code css: 
    
b.rtop, b.rbottom{
     display:block;
}

b.rtop b, b.rbottom b{
     display:block;
     height: 1px;
     overflow: hidden; 
     background: #6A6458
}

b.r1{
     margin: 0 5px;
}

b.r2{
     margin: 0 3px;
}

b.r3{
     margin: 0 2px;
}

b.rtop b.r4, b.rbottom b.r4{
     margin: 0 1px;
     height: 2px;
}
    0

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

    Posez votre question
  6. s.spark Messages postés 2528 Statut Contributeur 618
     
    C'est quoi toute ces balises b de partout ? Tu les as imbriqué °_°
    0
  7. krabs
     
    Bonjour,
    Oui j'ai tout trouver sur ce site:http://www.html.it/articoli/nifty/index.html
    (il texpliquera sa mieux que moi)
    sauf pour la bordure ...
    0
  8. s.spark Messages postés 2528 Statut Contributeur 618
     
    A mon avis, et c'est que mon avis, c'est impossible de le faire avec cette méthode de coin arrondi.

    Mais je pense qu'avec les balise propriétaire que je t'ai passé ça devrais être bon. 

    div {
-moz-border-radius: 10px 10px 10px 10px;
border: 3px inset #c0c0c0;
}

    0
    1. gryphus71
       
      -moz-border-radius: 10px 10px 10px 10px;

      mouai ...

      un "-moz-border-radius: 10px;" suffirait ;)
      0
      1. s.spark Messages postés 2528 Statut Contributeur 618 > gryphus71
         
        Je sais, la question n'est pas là.
        0
    2. Yessine
       
      il suffit de mettre sans moz
      #idbalise{
      border-radius: 10px;
      }
      0

Discussions similaires

bordure excel qui n'apparaissent pas
Marzhine -
Marzhine -

6 réponses
ajouter bordure photo sur mac
micmac2 -
micmac2 -

2 réponses
Excel:disparition des bordures des cellules
commentcamarchea -
sabrinaluv -

1 réponse
Bordures Capricieuses...
The_CyMerian -
The_CyMerian -

4 réponses
indice et exposant en css ?
yiv -
Kitkatryne -

19 réponses