Coins arrondis en css

Quelqu'un l'a défà fait ? Auriez vous un exemple de code que je comprenne?

9 avril 2006 à 0:09:13

Salut les zéros

</span>
J'ai vu que des gens utilisaient souvent ça et j'avou que je l'ai fais sur une image (donc sans css) et mon design est devenu d'un coup super beau et j'en suis fier, seulement il reste uen chose, le menu à refaire sur mon site. Pour cela j'aimerais refaire les coins, mais même avec les tutos proposés par les membres je n'y arrive pas. J'aimerais donc pour cela de l'aide extérieur par quelqu'un qui a déjà réalisé ceci.

Merci beaucoup

Reenjii

9 avril 2006 à 0:17:24

Tu as bien lu ce tuto du sdz et celui là de alsacréations ? Personnellement je trouve ça très bien expliqué.

De toute la manière de procéder est globalement la même, dis nous plus précisément ce que quoi tu bloque, pour qu'on puisse t'aider plus facilement !

Ciao !

Jashugal

9 avril 2006 à 0:20:55

Bah enfait je ne vois pas trop à quoi ils veulent en venir.

J'ai dans mon code ces parties:

.basgauche‚ .basdroit /* Propriétés communes aux deux coins de notre arrondi */
{
height: 20px;
width: 20px;
background–repeat: no–repeat;
}

.basgauche
{
background–image: url('basgauche.png');
}

.basdroit
{
background–image: url('basdroit.png');
float: right;
}

Et j'ai crée les images basdroit.png mais rien ne se passe... soit il est tard, soit j'ai réellement rien compris auw tutos (moi c'est plus le php si vous voulez enfait

)
Merci.

Anonyme

9 avril 2006 à 9:50:42

Dans ce cas créer une fonction php

function arrondi($texte)
{
echo '<img src="image/arrondi-haut.png" />
<div class="element_menu">' . $texte . '</div>
<img src="image/arrondi-bas.png" />
}

Le CSS c'est :

.element_menu {
margin-top: 0px;
margin-bottom: 0px;
}

Et sur ta page tu marque :

<div id="menu">
<?php arrondi(?>
<h3>salut</h3>
<p>ceci est mon menu</p>
<?php ); ?>

Jashugal

9 avril 2006 à 12:53:14

Ouaih mais là c'est encore plus dur que ce que j'ai lu, je ne vois vraiment pas comment faire, aurais-je loupé quelque chose ?

jp949

9 avril 2006 à 13:31:42

Ton menu est extensible ? sinon tu fais une simple image c'est pas + compliqué que ca

Jashugal

9 avril 2006 à 13:46:39

Il est extensible et à comme fond une image... :euh:

moltess

9 avril 2006 à 13:55:47

Il est extensible horizontalement? Verticalment? les deux?

Selon ce que tu veux réaliser, il va falloir couper ton menu en 3 (extensible seulement dans un sens) ou en 9 (extensible dans les deux sens).

Les tutos de Benjitheone explqiue très bien comment faire. Quel est ton problème?

Tu dis avoir crée les images et le CSS mais as-tu pensé à écrire le code xhtml qui va avec?

Jashugal

9 avril 2006 à 14:00:45

Il est extensible verticalement seulement, oui et j'ai ça dans mon menu:

<div class="element-menu">
<h3>Général</h3>
<ul>
<a href="http://www.festifoot.info/index.php?page=index">Accueil</a>
<a href="http://www.festifoot.info/index.php?page=inscription">Inscription</a>
<a href="http://www.festifoot.info/index.php?page=perdu">Pass perdu ?</a>
<a href="http://www.festifoot.info/visite.html/">Screenshots</a>
<a href="http://www.festifoot.info/index.php?page=news">News</a><br />
<a href="http://www.festifoot.info/index.php?page=contact">Contact</a>
</ul>
<div class="basgauche"></div><div class="basdroit"></div>
</div>

moltess

9 avril 2006 à 14:04:32

S'il est extensible seulement verticalement tu n'as pas besoin de faire de bas gauche et de bas droite, les deux coins peuvent être mis ensemble. Essaye de reprendre le tuto sur alsacréations : http://www.alsacreations.com/articles/cadre/ . Une fois que tu l'auras réussi, essaye de remplacer les images par les tiennes et le tour sera jouer