Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

aide pour CSS

79 réponses
Avatar
mannucci_spamkiller
Binsouère.

Je débute dans les CSS depuis quelques jours seulement, et suis sur la
personnalisation d'un thème Wordpress (c'est le Dyne 1.1).
je ne sais pas si c'est la meilleure idée pour mieux apprendre les CSS,
mais bon.

Et je galère grave pour modifier (pourtant "à peine") le menu
horizontal)

Voici la partie concernée du fichier style.css

#menu{background:url(images/menu2.png) repeat-x;
text-transform:uppercase; position:absolute; text-align:center:;
left:10%; height:55px; top:252px; margin:0; padding:0;}
#menu,#menu ul{list-style:none;line-height:2;}
#menu a,#menu a:hover{display:block; border:none; text-decoration:none;
color:#302b39;}
#menu li{float:left;list-style:none;border-right:1px solid #dad9ce;}
#menu a,#menu a:visited{display:block; font-weight:700; color:#302b39;
padding:10px 12px;}
#menu a:hover,#menu a:active{background-image:url(images/menu3.png);
position:relative; color:black; text-decoration:none;}

menu2.png est le fond pour les boutons, et menu3.png est le fond pour
ces mêmes boutons, mais pour le survol (2 carrés identiques mais de
couleurs differentes, en fait)

voilà ce que j'ai compris du mécanisme:
le menu se constitue horizontalement, avec un nombre de boutons
correspondant aux nombre de pages "publiées", chaque bouton a une
longueur variable (fonction de la longueur du titre donné à chaque page)
et est séparé du bouton suivant par une bande verticale de 1px (qui me
semble être le "border-right:1px" de la ligne "#menu li{.........}".
Le texte qui vient s'y poser est "centré", et forcé en "uppercase".

Ce qui m'emm...., c'est cette ligne de séparation verticale de 1 pixel,

moi, je voudrais conserver cette séparation (de 2px mais là n'est pas
problème), mais je la voudrais "transparente"... pour qu'on voit l'image
d'arrière-plan entre les boutons.

j'ai bien essayé de remplacer
#menu li{float:left;list-style:none;border-right:1px solid #dad9ce;}
par
#menu li{float:left;list-style:none;border-right:2px
border-color:transparent;}

mais ça n'a pas marché, je perds carrément la séparation.

bref, si quelqu'un sait comment je peux avoir 2 pixels transparents
comme intervalle, je serai vach'meeent content.

--
Jean-marc Mannucci
************************************************

10 réponses

1 2 3 4 5
Avatar
METIS
SAM wrote:
Yaka voir tout ces blogs au graphisme souvent succint :



Tiens, toi SAM qui aime les trucs qui servent à rien :

http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html

--
<|[;o)) METIS
http://www.graphM.com
Pour m'écrire en privé,
moi c'est metis15 et
je tourne à l'Oranges...
Avatar
Olivier Miakinen
Le 27/11/2008 16:54, METIS a écrit :

Tiens, toi SAM qui aime les trucs qui servent à rien :



Moi, j'aurais pas aimé.

http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html



Aaargh ! <http://www.maalox.fr/>, vite !
Avatar
METIS
Olivier Miakinen wrote:
Le 27/11/2008 16:54, METIS a écrit :

Tiens, toi SAM qui aime les trucs qui servent à rien :



Moi, j'aurais pas aimé.



C'était une boutade...(;o)))))))

--
<|[;o)) METIS
http://www.graphM.com
Pour m'écrire en privé,
moi c'est metis15 et
je tourne à l'Oranges...
Avatar
METIS
Olivier Miakinen wrote:
Aaargh ! <http://www.maalox.fr/>, vite !



Je dirais même plus, Ragh !!!!
C'est pu du Net, c'est de la télé...

--
<|[;o)) METIS
http://www.graphM.com
Pour m'écrire en privé,
moi c'est metis15 et
je tourne à l'Oranges...
Avatar
SAM
Le 11/27/08 4:54 PM, METIS a écrit :
SAM wrote:
Yaka voir tout ces blogs au graphisme souvent succint :



Tiens, toi SAM qui aime les trucs qui servent à rien :

http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html



Ha! ouais, super !
ça marche super bien, et mieux que d'autres que j'ai vu par ailleurs.

Dommage que ça soit basé sur jquery .... :-(
et ... près de 200ko pour un dock, doit y avoir moyen de faire à moins.
Asperges.

--
sm
Avatar
SAM
Le 11/27/08 5:08 PM, Olivier Miakinen a écrit :
Le 27/11/2008 16:54, METIS a écrit :
Tiens, toi SAM qui aime les trucs qui servent à rien :



Moi, j'aurais pas aimé.



J'aime bien ce dock.
Quant à Adrien ... bon ... faut pas lui en vouloir, il est gentil.

http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html



Aaargh ! <http://www.maalox.fr/>, vite !



Pas mieux ! 300ko c'coup-ci (et j'ai évité le beurk falache).
Y devraient prendre leurs médocs (dégeulasses au demeurant !), histoire
de les calmer : 38 imgages en page d'accueil ! Mais pourquoi ?































PS: Hein ? Quoi ? y s'appelle pas Adrien ? Bon ! C'est pas d'sa faute.

--
sm
Avatar
METIS
SAM wrote:
Le 11/27/08 4:54 PM, METIS a écrit :
SAM wrote:
Yaka voir tout ces blogs au graphisme souvent succint :



Tiens, toi SAM qui aime les trucs qui servent à rien :
http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html



Ha! ouais, super !
ça marche super bien, et mieux que d'autres que j'ai vu par ailleurs.

Dommage que ça soit basé sur jquery .... :-(
et ... près de 200ko pour un dock, doit y avoir moyen de faire à
moins. Asperges.



Ah bé je suis content que ça te plaise, mais franchement, c'est joli mais ça
sert à rien qu' à en foutre plein la vue...(;o)))))))

--
<|[;o)) METIS
http://www.graphM.com
Pour m'écrire en privé,
moi c'est metis15 et
je tourne à l'Oranges...
Avatar
SAM
Le 11/27/08 9:15 PM, METIS a écrit :
SAM wrote:
Le 11/27/08 4:54 PM, METIS a écrit :
http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html


Ha! ouais, super !
ça marche super bien, et mieux que d'autres que j'ai vu par ailleurs.



Ah bé je suis content que ça te plaise, mais franchement, c'est joli mais ça
sert à rien qu' à en foutre plein la vue...(;o)))))))



Toutafé !
Et comme là ce n'en est que le propos : je n'ai rien à redire :-)

Par contre si ça vient me distraire sur une page qui traite de sujets
+/- intéressants, je n'en dirai pas autant.

Il y avait un site d'un vendeur de Macs qui avait cru bon d'utiliser ce
genre de menu, mais ... il était très très lourd à charger.
Ou bien d'autres que moi s'en sont pleins ou bien ils ont réalisé
d'eux-mêmes leur erreur : il n'y est plus.

Ha!
Un autre truc qui n'est que d'esbrouffe et que j'adore :
<http://homepage.mac.com/jorgechamorro/>
Une fois enlevée l'image de fond (curieusement mamouthesque) ça pèse
dans les 150ko
Je suis absolument époustouflé des pages de calculs que ça demande et
qui ont étés écrites rien que pour ce gadget !
(bon ... que 880 lignes dont beaucoup de vides)
Au total 28ko soit l'équivalent d'une jquery (qui ne fait rien par
ele-même!!!).

Hein ?
Non, bien sur que non : ça ne fonctionne pas avec IE (même 7)
(c'est basé sur des canvas)

--
sm
Avatar
METIS
SAM wrote:
Un autre truc qui n'est que d'esbrouffe et que j'adore :
<http://homepage.mac.com/jorgechamorro/>



Putain les mecs, s'ils savent pas comment occuper leur vie, ils peuvent
toujours aller aider médecins sans frontière (ou une autre)...(;o)))))

--
<|[;o)) METIS
http://www.graphM.com
Pour m'écrire en privé,
moi c'est metis15 et
je tourne à l'Oranges...
Avatar
Olivier Masson
Olivier Miakinen a écrit :

Aaargh ! <http://www.maalox.fr/>, vite !



Ben pourtant les macuser sont fiers d'avoir ça sur leur OS :)
1 2 3 4 5