Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1728 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  CSS Petit éclaircissement

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

CSS Petit éclaircissement

n°1208908
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 16:45:42  profilanswer
 

Coucou,
 
Actuellement j'avais un truc de ce style là pour faire mes barres avec des coins arrondi:
 

Code :
  1. <ul class="newsbarre">
  2.           <li class="newshautdroite"><img src="/images/newsdr.bmp" width="5" height="20" alt="bd" /></li>
  3.           <li class="newshautdroite">15/09/05</li>
  4.           <li class="newstitre"><img src="/images/newsga.bmp" width="5" height="20" alt="bg" /></li>
  5.           <li class="newstitre">Edito</li>
  6.         </ul>


 

Code :
  1. .newsbarre {
  2. font: 12px/20px normal arial, helvetica, sans-serif;
  3. padding: 0px;
  4. margin: 0px;
  5. background-color: #8F8F45;
  6. color: #FFF;
  7. height: 20px;
  8. overflow:hidden;
  9. }
  11. .newsbarre .newshautdroite {
  12. float:right;
  13. }
  15. .newsbarre .newstitre {
  16. float:left;
  17. }
  19. .newsbarre li {
  20. display: inline;
  21. list-style-type: none;
  22. }


 
Mais ayant mis en place un systéme de changement de skin,
il faudrais plus que les 2 images soit dans le background
 
j'ai donc fait ceci:
 

Code :
  1. <ul class="newsbarre">
  2.           <li class="newshautdroitebis">&nbsp;</li>
  3.           <li class="newshautdroite">15/09/05</li>
  4.           <li class="newstitrebis">&nbsp;</li>
  5.           <li class="newstitre">Edito</li>
  6.         </ul>


 
Et en changant le CSS
 

Code :
  1. .newsbarre .newshautdroite,.newsbarre .newshautdroitebis {
  2. float:right;
  3. }
  5. .newsbarre .newshautdroitebis {
  6. background-image:url(/images/newsdrred.bmp) no-repeat;
  7. width:5px;
  8. }
  10. .newsbarre .newstitre,.newsbarre .newstitrebis {
  11. float:left;
  12. }
  14. .newsbarre .newshautdroitebis {
  15. background-image:url(/images/newsgared.bmp) no-repeat;
  16. width:5px;
  17. }


 
Mais était ce judicieux??
 
Si oui cool..mais sa m'étonnerais
 
Sinon ...
 
Merci... :hello:

mood
Publicité
Posté le 27-09-2005 à 16:45:42  profilanswer
 

n°1208915
FlorentG
Posté le 27-09-2005 à 16:47:40  profilanswer
 

C'est absolument pas judicieux, c'est un pur bricolage insipide, reposant sur une utilisation non-sémantique d'élément, sur une utilisation incorrrecte d'entité (le &nbsp; qui n'a complètement rien à foutre ici) et le seul moyen de faire des coins arrondis est celui-ci :)

Message cité 1 fois
n°1208927
j_lecruel
☀ ☁ ☂
Posté le 27-09-2005 à 16:51:34  profilanswer
 

Salut,
 
si je peux me permettre une petite remarque... le format BMP est absolument à bânir pour du WEB.
 
 
 

n°1208935
FlorentG
Posté le 27-09-2005 à 16:55:57  profilanswer
 

En plus ouais :jap:
 
Et le no-repeat qui squatte dans un background-image [:johneh]

n°1208939
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 16:59:12  profilanswer
 

Citation :


C'est absolument pas judicieux, c'est un pur bricolage insipide, reposant sur une utilisation non-sémantique d'élément, sur une utilisation incorrrecte d'entité (le &nbsp; qui n'a complètement rien à foutre ici) et le seul moyen de faire des coins arrondis est celui-ci :)


 
C'est pour cela que je demandais votre aide...voulant avoir un site le mieux possible, je suis plus a quelques heures de boulot prés...
Loin de la perfection, mais là cette question me titiller depuis longtemps..
 
Oki , lol je prend tous cela en considération... oui le no-repeat erreur de ma part en enlevent -image c'est mieux ;)

n°1208947
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 17:04:55  profilanswer
 

FlorentG a écrit :

C'est absolument pas judicieux, c'est un pur bricolage insipide, reposant sur une utilisation non-sémantique d'élément, sur une utilisation incorrrecte d'entité (le &nbsp; qui n'a complètement rien à foutre ici) et le seul moyen de faire des coins arrondis est celui-ci :)


 
 
Enfin c'est pas top, car sans javascript sa ne marche pas!!! :heink:  :(

n°1208952
FlorentG
Posté le 27-09-2005 à 17:06:54  profilanswer
 

On s'en fout. Sans JS, on aura une boîte normale, ce qui ne gêne rien... L'important, c'est d'accéder à l'information...

n°1208953
afbilou
pouet your life
Posté le 27-09-2005 à 17:07:09  profilanswer
 

Sauf que si ca marche pas c'est pas bien grave :)
Et que on aura pas a toucher au code HTML lorsque dans ... disons quelques mois ... les premiers navigateurs css 3 seront presents :)

n°1208959
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 17:08:57  profilanswer
 

Oui c'est sur...

n°1209072
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 18:41:26  profilanswer
 

Bon et si j'utilise ceci:
 
 border-radius: 7px;
 -moz-border-radius: 7px;
 
Dacord  sous IE sa marche pas...mais au moins j'aurais un code souple et prés pour le CSS3 et maybe IE7.....
 
C'est quand la sortie de ce dernier?

mood
Publicité
Posté le 27-09-2005 à 18:41:26  profilanswer
 

n°1209131
omega2
Posté le 27-09-2005 à 20:21:07  profilanswer
 

a quoi il sert le - devant moz-border-radius ?

Message cité 1 fois
n°1209146
xtof_83
Freeride Spirit
Posté le 27-09-2005 à 20:29:52  profilanswer
 

Je sais pas...
 
j'ai pas testé en mettant que border-radius: 7px;
 
Enfin c'est bien sympas ce truc... :jap:

n°1209237
FlorentG
Posté le 27-09-2005 à 22:10:05  profilanswer
 

omega2 a écrit :

a quoi il sert le - devant moz-border-radius ?


C'est parce que c'est un attribut propriétaire. Théoriquement, les attributs proprios doivent commencer par un -. Donc tu peux faire si tu développes ton propre browser un :

#pouet {
  -omega2-pouet-radius: 2em;
}


Et ça ne foirera pas au validateur, vu que c'est un truc proprio. Ca sert aux développeurs de navigateur la possiblilité de tester des technologies comme les CSS3, sans foirer au niveau de la validation...


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  CSS Petit éclaircissement

 

Sujets relatifs
Besoin d'un petit coup de main pour vba[CSS] div & float
[CSS] propriété nécessaire ?[SQL] Petit problème -> ...not contained in an aggregate function...
Durée de vie d'un a:visited en CSSCSS IE mini prob...déjà vu mais jarrive pas à mettre la main dessus
pb de menu CSS[CSS] bug IE ?
Héritage de taille em (CSS).[SQL] Petit problème avec clause SELECT
Plus de sujets relatifs à : CSS Petit éclaircissement

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.038 secondes

Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR