[CSS]probleme de design extensible arrondi

un probleme, que me proposez-vous?

Sujet résolu

15 janvier 2006 à 21:59:55

bonjour à tous,
je souhaiterais faire un cadre pour mon site web avec des coins arrondis.
mon plan:
des coins arrondis:
Image utilisateur

et des bandes de 1 pixel de largeur:(on les voit un peu minimes)
Image utilisateur

vos propositions accourrons SVP parce que je m'embrouille avec mes divs et ja'imerais bien un peu d'aide pour ca.
merci d'avance

.Nico

15 janvier 2006 à 23:45:23

Il faudrait peut être mettre des liens complets

jp949

16 janvier 2006 à 5:06:20

il manque de clarté ton post , explique un peu plus stp

rybus

16 janvier 2006 à 7:37:14

C'est ses images qui n'éxistent pas. Il soit que tu mette un liens soit que tu nous remette des images.

lift

16 janvier 2006 à 18:20:03

oui petite erreur dans l'adresse des images

bon je voudrais faire des repeat-x et des repeat-y avec les barres de 1 px pour obtenir un cadre et superposer les coins par dessus.
pour avoir un design extensible arrondi.

en realité c'est juste parce que je n'aime pas les cadres carrés.

recreaseb

16 janvier 2006 à 18:30:09

Dans mon souvenir il existait un bon tuto sur alsacreations

Informations sur le val d'europe

lift

17 janvier 2006 à 12:43:11

oui,
mais extensible soit en hauteur soit en toute dimension mais pas tel que je le veux.
je voudrais un CADRE<gras></gras> donc qui entoure mon texte pas des coins que l'on ajoute par dessus pour faire ilusion.

merci d'ores et deja(et plus encore) de vos reponses futures et à venir.

jp949

17 janvier 2006 à 12:51:01

vas a vette adresse tu auras toutes les explications pour faire ce que tu veux faire ici

a455bcd9

17 janvier 2006 à 12:52:47

Je me suis servi du tuto sur alsacréations, et ça fait bien un cadre qui entoure le texte : www.virtual-games.org
Et mon menu est extensible.

Le tuto en question : http://www.alsacreations.com/articles/cadre/

lift

17 janvier 2006 à 13:05:44

oh! desolé je n'avais pas vu:

Citation : Bogoris

Je suis vraiment dégoûté :

J'ai fait un design avec des tableaux, j'ai passé beaucoup de temps

J'ai lu le tuto de El Konkonbré M@squed sur la réalisation d'un design à l'aide de tableaux donc dégoûté d'avoir passé tant de temps alors que j'aurais pu avoir la solution vite fait (je ne connaissait pas les règles sous Photoshop).

J'ai lu le commentaire de Chahine :
Citation : Chahine

J'en connais un qui va hurler !
>> J'ai nommé neoxx78 !

qui m'a ramené sur un tuto sur la sémantique qui m'as ramené sur ce forum. Dégoûté de ne pas pouvoir utiliser les tableaux pour le design.

J'ai cherché une solution pour me passer des tableaux. Je l'ai trouvée. Je me dis : « Je vais en faire profiter les autres ! ». Et là je lis la deuxième page, dont le post de Raphaël :
Citation : Raphael

Have fun
http://www.alsacreations.com/articles/cadre/

Je cliques sur le lien et là , ils ont aussi la solution.

Mais après tout rien à faire, je poste quand même la mienne :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title>Design sans tableaux</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" href="comment_faire_sans_tableaux.css" />
</head>
<body>

<div class="cadre">

<div class="haut_1"><div class="haut_2"><div class="haut"></div></div></div>

<div class="milieu_1"><div class="milieu_2"><div class="milieu">



</div></div></div>

<div class="bas_1"><div class="bas_2"><div class="bas"></div></div></div>

</div>

</body>
</html>

/*-------------------*/
/* LES CADRES */
/*-------------------*/

.cadre
{
/* à vous de voir les propriétés à y mettre */
}

.haut_1
{
background : url("graphisme/images/hg.gif") no-repeat left ;
padding-left: 25px ;
height : 25px ;
}

.haut_2
{
background : url("graphisme/images/hd.gif") no-repeat right ;
padding-right: 25px ;
height : 25px ;
}

.haut
{
background : url("graphisme/images/hm.gif") repeat-x ;
width : 100% ;
height : 25px ;
}

.milieu_1
{
background : url("graphisme/images/mg.gif") repeat-y left ;
padding-left: 25px ;
}

.milieu_2
{
background : url("graphisme/images/md.gif") repeat-y right ;
padding-right: 25px ;
}

.milieu
{
background : black ;
color : white ;
width : 100% ;
}

.bas_1
{
background : url("graphisme/images/bg.gif") no-repeat left ;
padding-left: 25px ;
height : 25px ;
}

.bas_2
{
background : url("graphisme/images/bd.gif") no-repeat right ;
padding-right: 25px ;
height : 25px ;
}

.bas
{
background : url("graphisme/images/bm.gif") repeat-x bottom ;
width : 100% ;
height : 25px ;
}

Avec les images qui vont avec :

Vous pouvez tester : ça marche !
Allez ! Moi je vais défouler ma colère sur un autre forum !

PS : Désolé pour les coins : la flême de les mettre transparents .

desolé...double post.

un moderateur pourrait-il verouiller ce sujet svp? :euh: