Fork me on GitHub




(1) 2 »


blocks aux coins arrondis
Semi pro
Inscrit: 10/11/2004 13:40
Messages: 1659
Bonjour et bon week-end à tous !

Je voudrais savoir comment on fait pour faire des blocks arrondis un peu comme sur http://www.parent-solo.fr ?

voila le bout de css concernant mes blocks de gauche

/*===== Styles Colonne de Gauche =======*/
#xo-canvas-leftcolumn .xo-block {
    
padding-top:                    4px;
    
padding-bottom:                 10px;
    
margin-right:                    11px;
    
margin-bottom:                    10px;
    
background-color:                #FFF2C9;
    
border:                            1px solid #2D302C;
}
#xo-canvas-leftcolumn .xo-blocktitle {
    
padding-left:                    6px;
    
padding-bottom:                5px;
    
background-color:             inherit;
    
color:                            #A6C639;
    
font-size:                        1.2em;
    
font-weight:                    bold;
    
text-align:                     center;
}
#xo-canvas-leftcolumn .xo-blockcontent {
    
min-height:                        60px;
    
padding:                            2px 8px 0px;
    
background-color:             inherit;
}
html #xo-canvas-leftcolumn .xo-blockcontent {}
#xo-canvas-leftcolumn .xo-blockcontent a {}
#xo-canvas-leftcolumn .xo-blockcontent a:hover {}
#xo-canvas-leftcolumn img {
    
border:                             1px solid #B4D34E;
    
padding:                         3px;
    
margin:                             3px 3px 0 7px;
}
#xo-canvas-leftcolumn img:hover {border: 1px solid #222}

Posté le : 17/05/2008 15:01

PS : Toujours faire une sauvegarde des fichiers avant de les modifier !
-------------------------------------------
http://www.aideordi.com
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Guest_
b'jour,

Peut être une solution ici (je l'ai utilisé pour arrondir ce thème... mais vu que je n'ai rien noté, me souviens plus comment )

Sinon as-tu regardé le thème Zetagenesis ? Il est rondouillard à souhait

@+

Posté le : 17/05/2008 17:04
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Semi pro
Inscrit: 10/11/2004 13:40
Messages: 1659
Merci Burning je vais regarder ça de plus près !

Posté le : 17/05/2008 17:45

PS : Toujours faire une sauvegarde des fichiers avant de les modifier !
-------------------------------------------
http://www.aideordi.com
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Xoops accro
Inscrit: 25/02/2004 00:20
De Région parisienne
Messages: 2526
Un petit coup d'ajax : Mootools rounded corners

Posté le : 17/05/2008 18:26
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Semi pro
Inscrit: 10/11/2004 13:40
Messages: 1659
Re,

Burning j'arrive pas à trouver le thème Zetagenesis ?

Pour la première solution ça a l'air assez compliqué, j'ai trouvé un truc assez simple et testé mais ça marche pas avec IE http://zonecss.free.fr/style_css/feui ... ss_moz_border_radius.html

Posté le : 17/05/2008 18:58

PS : Toujours faire une sauvegarde des fichiers avant de les modifier !
-------------------------------------------
http://www.aideordi.com
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Supporter Xoops
Inscrit: 09/01/2005 13:37
De Breizh
Messages: 16972
Bonjour,

Citation :

Nikita a écrit:
Burning j'arrive pas à trouver le thème Zetagenesis ?


je crois qu'il est dans xoops 2.0.18 ou 2.0.18.1

@++

Posté le : 17/05/2008 19:04

La connaissance s'accroît quand on la partage ...
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Xoops accro
Inscrit: 25/02/2004 00:20
De Région parisienne
Messages: 2526
les propriétés css commençant par -moz sont exclusives au navigateur basé sur le moteur de mozilla, donc cela ne fonctionne pas avec IE

Posté le : 17/05/2008 19:06
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Aspirant
Inscrit: 19/04/2008 16:13
Messages: 28
J'ai réalisé un thème un jour avec le système Nifty Corners Cube , et ça fonctionnait plutôt bien.

Posté le : 18/05/2008 10:43
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Régulier
Inscrit: 09/04/2006 21:04
Messages: 423
Bonjour,
Sur le site de parent-solo les blocks ont une largeur fixe, pas très compliquer à mettre en place, il faut utiliser le CSS, des div avec des images dedans,tu leurs donnes une valeur en largeur en hauteur etc. maintenant si tu veux faire un block aux coins arrondi et flexible (C'est bien pour les mobiles) là c’est un peu compliquer, c’est surtout une histoire de compatibilité avec les navigateurs web.

Voici un lien pour faire un cadre arrondi en CSS et XHTML.

Posté le : 18/05/2008 13:23

Développeur web.
Partager Twitter Partagez cette article sur GG+
Re: blocks aux coins arrondis
Guest_
Merci Ankyo !!

Pourquoi faire compliqué alors que 2 bouts d'images suffisent !

Pour un gabarit morphogenesis, il suffit de modifier la feuille blocks.css. A 2 niveaux seulement s'il s'agit d'arrondir les blocs des colonnes latérales :

Pour le haut du bloc :
Citation :

#xo-canvas-leftcolumn .xo-blocktitle, #xo-canvas-rightcolumn .xo-blocktitle {
background: #fff url(../img/haut.gif) top left no-repeat;
}


Pour le corps du bloc :
Citation :

#xo-canvas-leftcolumn .xo-blockcontent, #xo-canvas-rightcolumn .xo-blockcontent {
background: #fff url(../img/bas.gif) bottom left no-repeat;
}


... plus simple c'est pô possible

@+

Posté le : 19/05/2008 00:14
Partager Twitter Partagez cette article sur GG+

 Haut   Précédent   Suivant
(1) 2 »



Vous pouvez voir les sujets.
Vous ne pouvez pas débuter de nouveaux sujets.
Vous ne pouvez pas répondre aux contributions.
Vous ne pouvez pas éditer vos contributions.
Vous ne pouvez pas effacez vos contributions.
Vous ne pouvez pas ajouter de nouveaux sondages.
Vous ne pouvez pas voter en sondage.
Vous ne pouvez pas attacher des fichiers à vos contributions.
Vous ne pouvez pas poster sans approbation.

Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

51 Personne(s) en ligne (36 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 51 | Plus ...